storybook@6 throws a core-js error

[43081j]

With storybook 6, my very basic typescript setup throws errors about core-js polyfills every time.

Module not found: Error: Can't resolve 'core-js/modules/web.dom-collections.iterator'

this is thrown from 'generated-stories-entry'. i can see earlier in the webpack output that the polyfill was built:

[./node_modules/@storybook/core/dist/server/common/polyfills.js] 120 bytes {vendors~main} [built]

which afaik is where you include core-js.

with storybook 5, this works just fine. its a clean setup from today, npm i -D @storybook/html (5 or 6) and this config:

module.exports = {
  stories: ['../src/**/*.stories.ts'],
  webpackFinal: (config) => {
    config.module.rules.push({
      test: /\.ts$/,
      use: [
        {loader: require.resolve('ts-loader')}
      ]
    });
    config.resolve.extensions.push('.ts');
    return config;
  }
};

I think this is because there are multiple core-js versions in my node_modules and storybook is resolving the wrong one (somehow). if i look at the one inside storybook's packages, its got the right files.

this isn't something i should have to 'fix' though IMO, as so many dependencies use core-js it seems like a very likely situation for many to bump into. my guess is you can fix it by installing core-js as a direct dependency but thats also far from ideal.

EDIT:

Temporary workaround

If you've come across this issue while searching, we do not yet have a solution merged in (this issue will close when we do). However, there is a workaround: simply install core-js@3 as a direct dependency (npm i -D core-js@3).

If that doesn't work for you, please do comment so we are aware in case there are some other edge cases.

[shilman]

cc @ndelangen

[gerdy]

I have the same problem.
I set a breakpoint on the webpackFinal method, but it did not trigger.
I suspect that the change here caused this problem, which was good before 6.0.0 beta14.

[ndelangen]

ERR! Module not found: Error: Can't resolve 'chromatic/isChromatic' in '<LOCAL_PROJECT_PATH>/node_modules/@storybook/ui/dist/components/layout'
(node:11596) UnhandledPromiseRejectionWarning: ModuleNotFoundError: Module not found: Error: Can't resolve 'chromatic/isChromatic' in '<LOCAL_PROJECT_PATH>/node_modules/@storybook/ui/dist/components/layout'

whut? I'm really confused.. the preview is bundling code for the manager.. and it's missing a devDependency..This makes very little sense..

[ben-reitz]

And as @43081j suggests, adding core-js v3 as a dev dependency fixes it but that doesn't seem like a great solution...

[kevinkuebler]

I just ran into the same issue trying to update my storybook from 5.2.5 to 6.0.0-rc.9. Like @BWrites I added the latest core-js as a dev dependency and that fixed it, but I agree that it's not a great solution.

[stale]

Hi everyone! Seems like there hasn't been much going on in this issue lately. If there are still questions, comments, or bugs, please feel free to continue the discussion. Unfortunately, we don't have time to get to every issue. We are always open to contributions so please send us a pull request if you would like to help. Inactive issues will be closed after 30 days. Thanks!

[43081j]

just a reminder that now that you published 6.0 officially, this is still a problem.

it is very awkward having to install core-js directly in each repo we use storybook for. do you have any suggested fix on your end for this? anything we can contribute to help?

[shilman]

@43081j I don't think we understand the problem. Perhaps @ndelangen can share some of his wisdom here.

[43081j]

essentially, storybook's generated output tries to require core-js for various polyfills.

im guessing because it is generated output and doesn't "live" in the storybook directory (node_modules/@storybook), it will resolve the first available core-js from the top level rather than resolving it relative to storybook's directory.

so if you have storybook in a project which already has a different version of core-js (not necessarily as a direct dependency, all sorts of other projects also depend on core-js), that one may be required by accident rather than the one storybook wants.

this means the paths fail to resolve if the two core-js versions are drastically different.

the workaround (npm i -D core-js) solves the problem because then your top-level core-js is the same version as the one storybook wants. the older version will have then been moved deeper to live alongside whatever was requiring it.

[shilman]

@43081j would you be available to pair with @ndelangen on this?

[MattFisher]

Also having this problem.

Based on #6204 (comment), I added this to my config and it's resolving correctly now:

resolve: {
    alias: {
        'core-js/modules': path.resolve(
            __dirname,
            '..',
            'node_modules/core-js/modules'
        ),
    }
}

Note that this is pointing to the root node_modules/core-js folder in my project, not to one that's bundled with anything else.

[43081j]

@shilman ill see if i get some free time at the weekend and will try debug it a bit at least. it'll be to do with the webpack config i guess and where it resolves modules from

my guess is we effectively run webpack from the project directory. then when we generate our webpack entry, somewhere down the tree we must require core-js. but by that point, webpack's CWD is the project dir rather than storybook's dir, so it will pick up whatever the root core-js version is instead of the one storybook wants.

we could do whats in the previous comment but use the path to storybook's core-js explicitly. but it seems a real shame and a bit hacky since this exact problem could happen with any number of dependencies in theory.

[mrtwinkler]

Same here. Just set up a clean project with vue-cli, added storybook and storybook-docs. npm run storybook results in lots of Module not found: Error: Can't resolve 'core-js/modules/....

[pmunin]

same here. Updating storybook from 5.3. to 6.0.12 - lead to bunch of errors like Can't resolve 'core-js/modules/web.dom-collections.iterator'

[kurt-unleashed]

Same here, even with the workaround :(

[endreujhelyi]

same got a bunch of error like
Module not found: Error: Can't resolve 'core-js/modules/web.dom-collections.iterator'
Module not found: Error: Can't resolve 'core-js/modules/es.symbol.iterator'

[awkale]

Also having this problem.

Based on #6204 (comment), I added this to my config and it's resolving correctly now:

resolve: {
    alias: {
        'core-js/modules': path.resolve(
            __dirname,
            '..',
            'node_modules/core-js/modules'
        ),
    }
}

Note that this is pointing to the root node_modules/core-js folder in my project, not to one that's bundled with anything else.

@MattFisher which config file?

[mayoyml]

@awkale main.js :)

[madroneropaulo]

Still doesn't work. Just updated with the patch 6.2.0-alpha.1

[ben-reitz]

This release has finally fixed it for our component library's Storybook - thanks!

[shilman]

For those of you whose projects are NOT fixed by 6.2.0-alpha.1, some suggestions:

• Try removing node_modules and/or lockfiles and reinstalling?
• Try removing whatever workarounds you've added before

If that still doesn't fix it, perhaps you can post a link to your repo and we might be able to take a look and see what's going on. Thanks and thanks for your patience on this!

[hydrosquall]

Hey, thanks for the continued work on this. Unfortunately, upgrading to 6.2.0-alpha.1 on a private repo didn't fix the stories, we didn't have any workarounds to remove. I'll update here if I come up with a minimal repo that contains the issue.

The repository is a mix of JS/typescript, managed by yarn 2 (berry), and has core-js version 3.0.1 specified at the root level package.json. Most of the errors are of the form

Module not found: Error: Your application tried to access core-js, but it isn't declared in your dependencies; this makes the require call ambiguous and unsound.

Required package: core-js (via "core-js/modules/es.string.iterator")
// path to some internal code

[henriquez]

I had this problem as well, to fix it I had to delete my node_modules and package-lock.json and update storybook and its add ons to alpha.6, including
"@storybook/addon-actions": "^6.2.0-alpha.6",
"@storybook/addon-links": "^6.2.0-alpha.6",
"@storybook/addons": "^6.2.0-alpha.6",
"@storybook/svelte": "^6.2.0-alpha.6"

This got storybook itself to load without errors, unfortunately my Svelte component is no longer recognized - Storybook says it can't find any components despite nothing changing since 5.3.

I had to revert to 5.3 since debugging this has already eaten the better part of a day. 5.3 works fine, no issues.

my main.js is

module.exports = {
  stories: ['../src/ui/*.stories.@(ts|js)'],
  addons: ['@storybook/addon-actions', '@storybook/addon-links'],
};

my Bot.stories.js file is

import Bot from './Bot.svelte';
import { action } from '@storybook/addon-actions';

export default {
  title: 'Bot',
  component: Bot,
}

// test fixtures
import testA from '../state/test/testA.json'; 
// initializations for reading test fixtures
// errors
//const fs = require('fs'), path = require('path'); 

;

// See https://github.com/YogliB/svelte-component-template/blob/master/src/stories/Button.stories.js
// for examples.
// the below yields an error
//const markdown = fs.readFileSync(path.join(__dirname, '../src/state/test/testA.json'), 'utf8');


// initial task state
export const startNewConversation = () => ({
  Component: Bot,

  // Pass props and bindings into component

  props: { testBotConfig: testA }
  //on: { click: action('clicked') },
});

[uriklar]

Hi @shilman, I'm seeing this error using v6.2.0-alpha.10.

My use case is that we have a library in node_modules that we are bundeling in our app, so I added this to the custom webpack config:

Custom webpack config

module.exports = {
    webpackFinal: async (config, { configType }) => {
        // `configType` has a value of 'DEVELOPMENT' or 'PRODUCTION'
        // You can change the configuration based on that.
        // 'PRODUCTION' is used when building the static version of storybook.

        // Make whatever fine-grained changes you need

        const { exclude, ...duplicatedConfig } = config.module.rules[0];

        config.module.rules[0] = {
            ...duplicatedConfig,
            include: [
                ...duplicatedConfig.include,
                fs.realpathSync(`${__dirname}/../node_modules/@honeybook/hbui`),
                fs.realpathSync(`${__dirname}/../node_modules/@honeybook/icons`)
            ]
        };

        // Return the altered config
        return config;
    }
};

Runtime error:

export.js:2 Uncaught TypeError: __webpack_require__(...) is not a function
    at Object../node_modules/core-js/internals/export.js (export.js:2)
    at __webpack_require__ (bootstrap:848)
    at fn (bootstrap:150)
    at Object../node_modules/core-js/modules/es.object.define-property.js (es.object.define-property.js:1)
    at __webpack_require__ (bootstrap:848)
    at fn (bootstrap:150)
    at Object../node_modules/webpack/buildin/module.js (harmony-module.js:24)
    at __webpack_require__ (bootstrap:848)
    at fn (bootstrap:150)
    at Object../node_modules/regenerator-runtime/runtime.js (runtime.js:8)

Webpack debug output:

{
mode: 'development',
bail: false,
devtool: '#cheap-module-source-map',
entry: [
 '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/core/dist/cjs/server/common/polyfills.js',
 '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/core/dist/cjs/server/preview/globals.js',
 '/Users/uriklar/Code/honeybook-react/.storybook/storybook-init-framework-entry.js',
 '/Users/uriklar/Code/honeybook-react/.storybook/preview.js-generated-config-entry.js',
 '/Users/uriklar/Code/honeybook-react/node_modules/webpack-hot-middleware/client.js?reload=true&quiet=false&noInfo=undefined'
],
output: {
 path: '/Users/uriklar/Code/honeybook-react/node_modules/.cache/storybook/public',
 filename: '[name].[hash].bundle.js',
 publicPath: ''
},
plugins: [
 FilterWarningsPlugin {
   exclude: [ /export '\S+' was not found in 'global'/ ]
 },
 VirtualModulesPlugin {
   _staticModules: {
     '/Users/uriklar/Code/honeybook-react/.storybook/storybook-init-framework-entry.js': "import '@storybook/react';",
     '/Users/uriklar/Code/honeybook-react/.storybook/preview.js-generated-config-entry.js': 'function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }\n' +
       '\n' +
       'function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }\n' +
       '\n' +
       'function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n' +
       '\n' +
       '/* eslint-disable import/no-unresolved */\n' +
       "import { addDecorator, addParameters, addLoader, addArgTypesEnhancer } from '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/client-api';\n" +
       "import { logger } from '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/client-logger';\n" +
       "import * as config from '/Users/uriklar/Code/honeybook-react/.storybook/preview.js';\n" +
       'Object.keys(config).forEach(function (key) {\n' +
       '  var value = config[key];\n' +
       '\n' +
       '  switch (key) {\n' +
       "    case 'args':\n" +
       "    case 'argTypes':\n" +
       '      {\n' +
       "        return logger.warn('Invalid args/argTypes in config, ignoring.', JSON.stringify(value));\n" +
       '      }\n' +
       '\n' +
       "    case 'decorators':\n" +
       '      {\n' +
       '        return value.forEach(function (decorator) {\n' +
       '          return addDecorator(decorator, false);\n' +
       '        });\n' +
       '      }\n' +
       '\n' +
       "    case 'loaders':\n" +
       '      {\n' +
       '        return value.forEach(function (loader) {\n' +
       '          return addLoader(loader, false);\n' +
       '        });\n' +
       '      }\n' +
       '\n' +
       "    case 'parameters':\n" +
       '      {\n' +
       '        return addParameters(_objectSpread({}, value), false);\n' +
       '      }\n' +
       '\n' +
       "    case 'argTypesEnhancers':\n" +
       '      {\n' +
       '        return value.forEach(function (enhancer) {\n' +
       '          return addArgTypesEnhancer(enhancer);\n' +
       '        });\n' +
       '      }\n' +
       '\n' +
       "    case 'globals':\n" +
       "    case 'globalTypes':\n" +
       '      {\n' +
       '        var v = {};\n' +
       '        v[key] = value;\n' +
       '        return addParameters(v, false);\n' +
       '      }\n' +
       '\n' +
       '    default:\n' +
       '      {\n' +
       '        // eslint-disable-next-line prefer-template\n' +
       "        return console.log(key + ' was not supported :( !');\n" +
       '      }\n' +
       '  }\n' +
       '});',
     '/Users/uriklar/Code/honeybook-react/.storybook/generated-stories-entry.js': '"use strict";\n' +
       '\n' +
       'var _frameworkImportPath = require("@storybook/react");\n' +
       '\n' +
       '/* eslint-disable import/no-unresolved */\n' +
       '(0, _frameworkImportPath.configure)([], module, false);'
   }
 },
 HtmlWebpackPlugin {
   options: {
     template: '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/core/dist/cjs/server/templates/index.ejs',
     templateContent: false,
     templateParameters: [Function: templateParameters],
     filename: 'iframe.html',
     publicPath: 'auto',
     hash: false,
     inject: false,
     scriptLoading: 'blocking',
     compile: true,
     favicon: false,
     minify: {
       collapseWhitespace: true,
       removeComments: true,
       removeRedundantAttributes: true,
       removeScriptTypeAttributes: false,
       removeStyleLinkTypeAttributes: true,
       useShortDoctype: true
     },
     cache: true,
     showErrors: true,
     chunks: 'all',
     excludeChunks: [],
     chunksSortMode: 'none',
     meta: {},
     base: false,
     title: 'Webpack App',
     xhtml: false,
     alwaysWriteToDisk: true
   },
   childCompilerHash: undefined,
   assetJson: undefined,
   hash: undefined,
   version: 4
 },
 DefinePlugin {
   definitions: {
     'process.env': {
       NODE_ENV: '"development"',
       NODE_PATH: '""',
       STORYBOOK: '"true"',
       PUBLIC_URL: '"."'
     },
     NODE_ENV: '"development"'
   }
 },
 WatchMissingNodeModulesPlugin {
   nodeModulesPath: '/Users/uriklar/Code/honeybook-react/node_modules'
 },
 HotModuleReplacementPlugin {
   options: {},
   multiStep: undefined,
   fullBuildTimeout: 200,
   requestTimeout: 10000
 },
 CaseSensitivePathsPlugin {
   options: {},
   logger: {
     log: [Function: bound consoleCall],
     warn: [Function: bound consoleCall],
     dir: [Function: bound consoleCall],
     time: [Function: bound consoleCall],
     timeEnd: [Function: bound consoleCall],
     timeLog: [Function: bound consoleCall],
     trace: [Function: bound consoleCall],
     assert: [Function: bound consoleCall],
     clear: [Function: bound consoleCall],
     count: [Function: bound consoleCall],
     countReset: [Function: bound consoleCall],
     group: [Function: bound consoleCall],
     groupEnd: [Function: bound consoleCall],
     table: [Function: bound consoleCall],
     debug: [Function: bound consoleCall],
     info: [Function: bound consoleCall],
     dirxml: [Function: bound consoleCall],
     error: [Function: bound consoleCall],
     groupCollapsed: [Function: bound consoleCall],
     Console: [Function: Console],
     profile: [Function: profile],
     profileEnd: [Function: profileEnd],
     timeStamp: [Function: timeStamp],
     context: [Function: context],
     [Symbol(kBindStreamsEager)]: [Function: bound ],
     [Symbol(kBindStreamsLazy)]: [Function: bound ],
     [Symbol(kBindProperties)]: [Function: bound ],
     [Symbol(kWriteToConsole)]: [Function: bound ],
     [Symbol(kGetInspectOptions)]: [Function: bound ],
     [Symbol(kFormatForStdout)]: [Function: bound ],
     [Symbol(kFormatForStderr)]: [Function: bound ]
   },
   pathCache: {},
   fsOperations: 0,
   primed: false
 },
 ProgressPlugin {
   profile: false,
   handler: undefined,
   modulesCount: 500,
   showEntries: false,
   showModules: true,
   showActiveModules: true
 },
 DefinePlugin { definitions: {} },
 DocgenPlugin {
   name: 'React Docgen Typescript Plugin',
   options: {
     shouldExtractLiteralValuesFromEnum: true,
     shouldRemoveUndefinedFromOptional: true,
     propFilter: [Function: propFilter]
   }
 }
],
module: {
 rules: [
   {
     test: /\.(mjs|tsx?|jsx?)$/,
     use: [
       {
         loader: '/Users/uriklar/Code/honeybook-react/node_modules/babel-loader/lib/index.js',
         options: {
           cacheDirectory: '/Users/uriklar/Code/honeybook-react/node_modules/.cache/storybook/babel',
           sourceType: 'unambiguous',
           presets: [
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/preset-env/lib/index.js',
               { shippedProposals: true }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/preset-typescript/lib/index.js',
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/preset-react/lib/index.js',
               { runtime: 'automatic' }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/preset-flow/lib/index.js'
           ],
           plugins: [
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-shorthand-properties/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-block-scoping/lib/index.js',
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-decorators/lib/index.js',
               { legacy: true }
             ],
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-class-properties/lib/index.js',
               { loose: true }
             ],
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-private-methods/lib/index.js',
               { loose: true }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-export-default-from/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js',
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-object-rest-spread/lib/index.js',
               { loose: true, useBuiltIns: true }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-classes/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-arrow-functions/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-parameters/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-destructuring/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-spread/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-for-of/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/babel-plugin-macros/dist/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-optional-chaining/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-nullish-coalescing-operator/lib/index.js',
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/babel-plugin-polyfill-corejs3/lib/index.js',
               {
                 method: 'usage-global',
                 absoluteImports: '/Users/uriklar/Code/honeybook-react/node_modules/core-js/index.js',
                 version: '3.8.1'
               }
             ],
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/babel-plugin-emotion/dist/babel-plugin-emotion.cjs.js',
               { sourceMap: true, autoLabel: true }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/babel-plugin-add-react-displayname/index.js'
           ],
           overrides: [
             {
               test: /\.(mjs|jsx?)$/,
               plugins: [
                 [
                   '/Users/uriklar/Code/honeybook-react/node_modules/babel-plugin-react-docgen/lib/index.js',
                   {
                     DOC_GEN_COLLECTION_NAME: 'STORYBOOK_REACT_CLASSES'
                   }
                 ]
               ]
             }
           ]
         }
       }
     ],
     include: [
       '/Users/uriklar/Code/honeybook-react',
       '/Users/uriklar/Code/honeybook-react/node_modules/@honeybook/hbui',
       '/Users/uriklar/Code/honeybook-react/node_modules/@honeybook/icons'
     ]
   },
   {
     test: /\.js$/,
     use: [
       {
         loader: '/Users/uriklar/Code/honeybook-react/node_modules/babel-loader/lib/index.js',
         options: {
           sourceType: 'unambiguous',
           presets: [
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/preset-env/lib/index.js',
               {
                 shippedProposals: true,
                 modules: false,
                 targets: 'defaults'
               }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/preset-react/lib/index.js'
           ],
           plugins: [
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-shorthand-properties/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-block-scoping/lib/index.js',
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-decorators/lib/index.js',
               { legacy: true }
             ],
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-class-properties/lib/index.js',
               { loose: true }
             ],
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-private-methods/lib/index.js',
               { loose: true }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-export-default-from/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js',
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-object-rest-spread/lib/index.js',
               { loose: true, useBuiltIns: true }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-classes/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-arrow-functions/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-parameters/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-destructuring/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-spread/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-for-of/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/babel-plugin-macros/dist/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-optional-chaining/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-nullish-coalescing-operator/lib/index.js',
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/babel-plugin-polyfill-corejs3/lib/index.js',
               {
                 method: 'usage-global',
                 absoluteImports: '/Users/uriklar/Code/honeybook-react/node_modules/core-js/index.js',
                 version: '3.8.1'
               }
             ]
           ]
         }
       }
     ],
     include: [Function: include]
   },
   {
     test: /\.md$/,
     use: [
       {
         loader: '/Users/uriklar/Code/honeybook-react/node_modules/raw-loader/dist/cjs.js'
       }
     ]
   },
   {
     test: /\.css$/,
     sideEffects: true,
     use: [
       '/Users/uriklar/Code/honeybook-react/node_modules/style-loader/dist/cjs.js',
       {
         loader: '/Users/uriklar/Code/honeybook-react/node_modules/css-loader/dist/cjs.js',
         options: { importLoaders: 1 }
       },
       {
         loader: '/Users/uriklar/Code/honeybook-react/node_modules/postcss-loader/src/index.js',
         options: {
           ident: 'postcss',
           postcss: {},
           plugins: [Function: plugins]
         }
       }
     ]
   },
   {
     test: /\.(svg|ico|jpg|jpeg|png|apng|gif|eot|otf|webp|ttf|woff|woff2|cur|ani|pdf)(\?.*)?$/,
     loader: '/Users/uriklar/Code/honeybook-react/node_modules/file-loader/dist/cjs.js',
     options: { name: 'static/media/[name].[hash:8].[ext]', esModule: false }
   },
   {
     test: /\.(mp4|webm|wav|mp3|m4a|aac|oga)(\?.*)?$/,
     loader: '/Users/uriklar/Code/honeybook-react/node_modules/url-loader/dist/cjs.js',
     query: { limit: 10000, name: 'static/media/[name].[hash:8].[ext]' }
   }
 ]
},
resolve: {
 extensions: [
   '.mjs', '.js',
   '.jsx', '.ts',
   '.tsx', '.json',
   '.cjs'
 ],
 modules: [ 'node_modules' ],
 mainFields: [ 'browser', 'main' ],
 alias: {
   '@emotion/core': '/Users/uriklar/Code/honeybook-react/node_modules/@emotion/core',
   '@emotion/styled': '/Users/uriklar/Code/honeybook-react/node_modules/@emotion/styled',
   'emotion-theming': '/Users/uriklar/Code/honeybook-react/node_modules/emotion-theming',
   '@storybook/addons': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/addons',
   '@storybook/api': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/api',
   '@storybook/channels': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/channels',
   '@storybook/channel-postmessage': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/channel-postmessage',
   '@storybook/components': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/components',
   '@storybook/core-events': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/core-events',
   '@storybook/router': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/router',
   '@storybook/theming': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/theming',
   '@storybook/semver': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/core/node_modules/@storybook/semver',
   '@storybook/client-api': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/client-api',
   '@storybook/client-logger': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/client-logger',
   react: '/Users/uriklar/Code/honeybook-react/node_modules/react',
   'react-dom': '/Users/uriklar/Code/honeybook-react/node_modules/react-dom'
 },
 plugins: [
   {
     apply: [Function: nothing],
     makePlugin: [Function],
     moduleLoader: [Function],
     topLevelLoader: { apply: [Function: nothing] },
     bind: [Function],
     tsLoaderOptions: [Function],
     forkTsCheckerOptions: [Function]
   }
 ]
},
resolveLoader: { plugins: [ { apply: [Function: nothing] } ] },
optimization: {
 splitChunks: { chunks: 'all' },
 runtimeChunk: true,
 sideEffects: true,
 usedExports: true,
 concatenateModules: true,
 minimizer: []
},
performance: { hints: false }
}
Manager webpack config
{
name: 'manager',
mode: 'development',
bail: false,
devtool: 'none',
entry: [
 '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/core/dist/cjs/server/common/polyfills.js',
 '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/core/dist/cjs/client/manager/index.js',
 '/Users/uriklar/Code/honeybook-react/.storybook/generated-refs.js'
],
output: {
 path: '/Users/uriklar/Code/honeybook-react/node_modules/.cache/storybook/public',
 filename: '[name].[chunkhash].bundle.js',
 publicPath: ''
},
cache: FileSystemCache {
 basePath: '/Users/uriklar/Code/honeybook-react/node_modules/.cache/storybook/dev-server',
 ns: '325c8f456729b912b0d2134054eb7448'
},
plugins: [
 VirtualModulesPlugin {
   _staticModules: {
     '/Users/uriklar/Code/honeybook-react/.storybook/generated-refs.js': '"use strict";\n' +
       '\n' +
       'var _addons = require("@storybook/addons");\n' +
       '\n' +
       '_addons.addons.setConfig({\n' +
       '  refs: {}\n' +
       '});'
   }
 },
 HtmlWebpackPlugin {
   options: {
     template: '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/core/dist/cjs/server/templates/index.ejs',
     templateContent: false,
     templateParameters: [Function: templateParameters],
     filename: 'index.html',
     publicPath: 'auto',
     hash: false,
     inject: false,
     scriptLoading: 'blocking',
     compile: true,
     favicon: false,
     minify: 'auto',
     cache: true,
     showErrors: true,
     chunks: 'all',
     excludeChunks: [],
     chunksSortMode: 'none',
     meta: {},
     base: false,
     title: 'Webpack App',
     xhtml: false,
     alwaysWriteToDisk: true
   },
   childCompilerHash: undefined,
   assetJson: undefined,
   hash: undefined,
   version: 4
 },
 CaseSensitivePathsPlugin {
   options: {},
   logger: {
     log: [Function: bound consoleCall],
     warn: [Function: bound consoleCall],
     dir: [Function: bound consoleCall],
     time: [Function: bound consoleCall],
     timeEnd: [Function: bound consoleCall],
     timeLog: [Function: bound consoleCall],
     trace: [Function: bound consoleCall],
     assert: [Function: bound consoleCall],
     clear: [Function: bound consoleCall],
     count: [Function: bound consoleCall],
     countReset: [Function: bound consoleCall],
     group: [Function: bound consoleCall],
     groupEnd: [Function: bound consoleCall],
     table: [Function: bound consoleCall],
     debug: [Function: bound consoleCall],
     info: [Function: bound consoleCall],
     dirxml: [Function: bound consoleCall],
     error: [Function: bound consoleCall],
     groupCollapsed: [Function: bound consoleCall],
     Console: [Function: Console],
     profile: [Function: profile],
     profileEnd: [Function: profileEnd],
     timeStamp: [Function: timeStamp],
     context: [Function: context],
     [Symbol(kBindStreamsEager)]: [Function: bound ],
     [Symbol(kBindStreamsLazy)]: [Function: bound ],
     [Symbol(kBindProperties)]: [Function: bound ],
     [Symbol(kWriteToConsole)]: [Function: bound ],
     [Symbol(kGetInspectOptions)]: [Function: bound ],
     [Symbol(kFormatForStdout)]: [Function: bound ],
     [Symbol(kFormatForStderr)]: [Function: bound ]
   },
   pathCache: {},
   fsOperations: 0,
   primed: false
 },
 DefinePlugin { definitions: {} },
 DefinePlugin {
   definitions: {
     'process.env': {
       NODE_ENV: '"development"',
       NODE_PATH: '""',
       STORYBOOK: '"true"',
       PUBLIC_URL: '""'
     },
     NODE_ENV: '"development"'
   }
 }
],
module: {
 rules: [
   {
     test: /\.(mjs|tsx?|jsx?)$/,
     use: [
       {
         loader: '/Users/uriklar/Code/honeybook-react/node_modules/babel-loader/lib/index.js',
         options: {
           sourceType: 'unambiguous',
           presets: [
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/preset-env/lib/index.js',
               { shippedProposals: true }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/preset-typescript/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/preset-react/lib/index.js'
           ],
           plugins: [
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-shorthand-properties/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-block-scoping/lib/index.js',
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-decorators/lib/index.js',
               { legacy: true }
             ],
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-class-properties/lib/index.js',
               { loose: true }
             ],
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-private-methods/lib/index.js',
               { loose: true }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-export-default-from/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js',
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-object-rest-spread/lib/index.js',
               { loose: true, useBuiltIns: true }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-classes/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-arrow-functions/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-parameters/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-destructuring/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-spread/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-for-of/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/babel-plugin-macros/dist/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-optional-chaining/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-nullish-coalescing-operator/lib/index.js',
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/babel-plugin-polyfill-corejs3/lib/index.js',
               {
                 method: 'usage-global',
                 absoluteImports: '/Users/uriklar/Code/honeybook-react/node_modules/core-js/index.js',
                 version: '3.8.1'
               }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-template-literals/lib/index.js'
           ]
         }
       }
     ],
     include: [ '/Users/uriklar/Code/honeybook-react' ],
     exclude: [ /node_modules/, /dist/ ]
   },
   {
     test: /\.js$/,
     use: [
       {
         loader: '/Users/uriklar/Code/honeybook-react/node_modules/babel-loader/lib/index.js',
         options: {
           sourceType: 'unambiguous',
           presets: [
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/preset-env/lib/index.js',
               {
                 shippedProposals: true,
                 modules: false,
                 targets: 'defaults'
               }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/preset-react/lib/index.js'
           ],
           plugins: [
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-shorthand-properties/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-block-scoping/lib/index.js',
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-decorators/lib/index.js',
               { legacy: true }
             ],
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-class-properties/lib/index.js',
               { loose: true }
             ],
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-private-methods/lib/index.js',
               { loose: true }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-export-default-from/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-syntax-dynamic-import/lib/index.js',
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-object-rest-spread/lib/index.js',
               { loose: true, useBuiltIns: true }
             ],
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-classes/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-arrow-functions/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-parameters/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-destructuring/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-spread/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-transform-for-of/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/babel-plugin-macros/dist/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-optional-chaining/lib/index.js',
             '/Users/uriklar/Code/honeybook-react/node_modules/@babel/plugin-proposal-nullish-coalescing-operator/lib/index.js',
             [
               '/Users/uriklar/Code/honeybook-react/node_modules/babel-plugin-polyfill-corejs3/lib/index.js',
               {
                 method: 'usage-global',
                 absoluteImports: '/Users/uriklar/Code/honeybook-react/node_modules/core-js/index.js',
                 version: '3.8.1'
               }
             ]
           ]
         }
       }
     ],
     include: [Function: include]
   },
   {
     test: /\.css$/,
     use: [
       '/Users/uriklar/Code/honeybook-react/node_modules/style-loader/dist/cjs.js',
       {
         loader: '/Users/uriklar/Code/honeybook-react/node_modules/css-loader/dist/cjs.js',
         options: { importLoaders: 1 }
       }
     ]
   },
   {
     test: /\.(svg|ico|jpg|jpeg|png|apng|gif|eot|otf|webp|ttf|woff|woff2|cur|ani|pdf)(\?.*)?$/,
     loader: '/Users/uriklar/Code/honeybook-react/node_modules/file-loader/dist/cjs.js',
     query: { name: 'static/media/[name].[hash:8].[ext]' }
   },
   {
     test: /\.(mp4|webm|wav|mp3|m4a|aac|oga)(\?.*)?$/,
     loader: '/Users/uriklar/Code/honeybook-react/node_modules/url-loader/dist/cjs.js',
     query: { limit: 10000, name: 'static/media/[name].[hash:8].[ext]' }
   }
 ]
},
resolve: {
 extensions: [
   '.mjs', '.js',
   '.jsx', '.json',
   '.cjs', '.ts',
   '.tsx'
 ],
 modules: [ 'node_modules' ],
 mainFields: [ 'browser', 'main' ],
 alias: {
   '@emotion/core': '/Users/uriklar/Code/honeybook-react/node_modules/@emotion/core',
   '@emotion/styled': '/Users/uriklar/Code/honeybook-react/node_modules/@emotion/styled',
   'emotion-theming': '/Users/uriklar/Code/honeybook-react/node_modules/emotion-theming',
   '@storybook/addons': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/addons',
   '@storybook/api': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/api',
   '@storybook/channels': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/channels',
   '@storybook/components': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/components',
   '@storybook/core-events': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/core-events',
   '@storybook/router': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/router',
   '@storybook/theming': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/theming',
   '@storybook/ui': '/Users/uriklar/Code/honeybook-react/node_modules/@storybook/ui',
   react: '/Users/uriklar/Code/honeybook-react/node_modules/react',
   'react-dom': '/Users/uriklar/Code/honeybook-react/node_modules/react-dom'
 },
 plugins: [
   {
     apply: [Function: nothing],
     makePlugin: [Function],
     moduleLoader: [Function],
     topLevelLoader: { apply: [Function: nothing] },
     bind: [Function],
     tsLoaderOptions: [Function],
     forkTsCheckerOptions: [Function]
   }
 ]
},
resolveLoader: { plugins: [ { apply: [Function: nothing] } ] },
recordsPath: '/Users/uriklar/Code/honeybook-react/node_modules/.cache/storybook/public/records.json',
performance: { hints: false },
optimization: {
 splitChunks: { chunks: 'all' },
 runtimeChunk: true,
 sideEffects: true,
 usedExports: true,
 concatenateModules: true,
 minimizer: []
}
}

I tried these suggested solutions:

• Installing core-js and aliassing it in the webpack config
• Removing node_modules and lock file and re installing

Any suggestions?

[shilman]

@43081j any chance you can provide some support on this one? looks like people are still running into this issue even after your change.

[43081j]

the previous problem with __webpack_require__ feels like its another issue.

somehow the webpack overrides conflicting maybe, its difficult to reproduce that one for sure. @uriklar if you could throw together a test repo which reproduces that problem, that'd be a big help. a minimal reproduction, trying to strip away as much as you can without making the problem go away.

same for you @henriquez , if you can reproduce it in a repo somewhere we can try debug a bit

[hydrosquall]

Good news update on #11255 (comment)

I investigated this bug with @arcanis, who quickly identified the issue. We found the error was due to the fact that a dependency of the main application (the one using storybook) was in a separate yarn workspace that did not have core-js explicitly specified as a dependency.

Adding the same version of core-js as a dependency to that library workspace as the version in the main application (the one where storybook is explicitly used) fixes the issue (using Storybook 6.0.21).

[Ayc0]

Also, I found another workaround: when using yarn pnp + workspaces, if core-js is available in the top level module but not in a sub-package, adding this line in the main.js file should work:

config.resolve.alias["core-js"] = path.dirname(require.resolve("core-js"));

(require.resolve("core-js") will return the path to the .../node-modules/core-js/index.js file in pnp, and then path.dirname(...) will return the path to core-js itself and thus when core-js/module will be required, it'll indeed generate .../node-modules/core-js/module and not .../node-modules/core-js/index.js/module)

[obonyojimmy]

Simply install core-js dependecy npm i core-js

[jmlaya]

That workaround didn't work for me, I needed to configure specific aliases in the main.js file for core-js modules with name conflicts:

const path = require('path');

module.exports = {
  "stories": [
    "../src/**/*.stories.mdx",
    "../src/**/*.stories.@(js|jsx|ts|tsx)"
  ],
  "addons": [
    "@storybook/addon-links",
    "@storybook/addon-essentials"
  ],
  webpackFinal: async (config, { configType }) => {
    config.resolve.alias = {
      ...config.resolve.alias,
      'core-js/modules/es6.object.keys': path.resolve(
        __dirname,
        '../node_modules/core-js/modules/es.object.keys',
      ),
      'core-js/modules/es7.object.get-own-property-descriptors': path.resolve(
        __dirname,
        '../node_modules/core-js/modules/es.object.get-own-property-descriptors',
      ),
      'core-js/modules/web.dom.iterable': path.resolve(
        __dirname,
        '../node_modules/core-js/modules/web.dom-collections.iterator.js',
      ),
      'core-js/modules': path.resolve(
        __dirname,
        '../node_modules/core-js/modules',
      ),
    }

    return config;
  },
}

[Ayc0]

@jmlaya you should try the snippet I wrote:

config.resolve.alias["core-js"] = path.dirname(require.resolve("core-js"));

I did it this way so that it'll work for all submodules si it should help you too

[charkour]

Adding core-js as a Dev Dep to the package I was importing solved my issue.

[jmlaya]

@Ayc0 I did something similar, but these files with these names do not exist anymore in the core-js package:

• es6.object.keys
• es7.object.get-own-property-descriptors
• web.dom.iterable

[chrisabrams]

Also, I found another workaround: when using yarn pnp + workspaces, if core-js is available in the top level module but not in a sub-package, adding this line in the main.js file should work:

config.resolve.alias["core-js"] = path.dirname(require.resolve("core-js"));

(require.resolve("core-js") will return the path to the .../node-modules/core-js/index.js file in pnp, and then path.dirname(...) will return the path to core-js itself and thus when core-js/module will be required, it'll indeed generate .../node-modules/core-js/module and not .../node-modules/core-js/index.js/module)

dirname was the magic I needed, thanks!

[henriquez]

Simply install core-js dependency with npm i core-js

This worked for me when storybook 6 complained about core-js missing in dependency I was loading from another project, the key here is to install core-js in that other project not in the project that is using storybook. (core js was already installed in the project using storybook, but not in the project containing the dependency when the error occurred)

[shaodowm]

That workaround didn't work for me, I needed to configure specific aliases in the main.js file for core-js modules with name conflicts:

const path = require('path');

module.exports = {
  "stories": [
    "../src/**/*.stories.mdx",
    "../src/**/*.stories.@(js|jsx|ts|tsx)"
  ],
  "addons": [
    "@storybook/addon-links",
    "@storybook/addon-essentials"
  ],
  webpackFinal: async (config, { configType }) => {
    config.resolve.alias = {
      ...config.resolve.alias,
      'core-js/modules/es6.object.keys': path.resolve(
        __dirname,
        '../node_modules/core-js/modules/es.object.keys',
      ),
      'core-js/modules/es7.object.get-own-property-descriptors': path.resolve(
        __dirname,
        '../node_modules/core-js/modules/es.object.get-own-property-descriptors',
      ),
      'core-js/modules/web.dom.iterable': path.resolve(
        __dirname,
        '../node_modules/core-js/modules/web.dom-collections.iterator.js',
      ),
      'core-js/modules': path.resolve(
        __dirname,
        '../node_modules/core-js/modules',
      ),
    }

    return config;
  },
}

I have the same problem with you. You can try to add the option corejs: 3 with @babel/preset-env config in your .babelrc file and this works for me.

[
    "@babel/preset-env",
    {
      "modules": false,
      "targets": {
        "browsers": ["iOS >= 9"]
      },
      "useBuiltIns": "usage",
      "corejs": 3
    }
  ]