[CRA] dynamic Import don't work

Describe the bug If using dynamic import, throw error Support for the experimental syntax 'dynamicImport' isn't currently enabled. But in CRA don’t have the error.

To Reproduce Steps to reproduce the behavior:

1. Create a new project with CRA and SB
2. Use dynamic import
3. See error

System:

• OS: [MacOS]
• Framework: CRA 2.0.5
• Version: [e.g. 4.0.4]

[igor-dv]

As a workaround, you can create .babelrc in the .storybook dir with something like this:

{
  "presets": ["@babel/preset-env", "@babel/preset-react"],
  "plugins": ["@babel/plugin-syntax-dynamic-import"]
}

(Maybe some other plugins/presets will be needed)

@Hypnosphi , WYT about adding this by default ? looks like CRA uses it

[patrickleet]

Came across this today - took some digging, but eventually found a solution.

The bug is actually in webpack, which storybook uses.

It is this: https://github.com/webpack/webpack/issues/8656

The solution is to install the correct version of acorn

npm i --save-dev acorn@6.1.1

Maybe worth doing the whole rm -rf node_modules && rm package-lock.json thing as well.

For completeness, here is the .babelrc file that worked with our project:

.babelrc

{
  "presets":[
    ["@babel/preset-env"],
    ["@babel/preset-react"],
  ],
  "plugins": [
    ["@babel/plugin-proposal-class-properties"],
    ["@babel/plugin-transform-runtime",
      {
        "regenerator": true
      }
    ],
    ["@babel/plugin-syntax-dynamic-import"]
  ]
}

and relevant devdeps from package.json:

  "devDependencies": {
    "@babel/core": "7.4.5",
    "@babel/plugin-proposal-class-properties": "^7.4.4",
    "@babel/plugin-syntax-dynamic-import": "^7.2.0",
    "@babel/plugin-transform-runtime": "^7.4.4",
    "@babel/polyfill": "^7.4.4",
    "@babel/preset-env": "^7.4.5",
    "@babel/preset-react": "^7.0.0",
    "@babel/register": "7.4.4",
    "@babel/runtime": "7.4.5",
    "@storybook/addon-actions": "^5.1.9",
    "@storybook/addon-knobs": "^5.1.9",
    "@storybook/addon-links": "^5.1.9",
    "@storybook/addons": "^5.1.9",
    "@storybook/react": "^5.1.9",
    "acorn": "^6.1.1",
    "babel-loader": "^8.0.6",
    ...
}