After rewriting all my dynamic System.import
calls to import
webpack compilation fails:
Module build failed: SyntaxError: (...)/dashboard.js: Unexpected token (7:4)
5 |
6 | export default Promise.all([
> 7 | import('charts')
| ^
webpack.config.js
:
module:
{
loaders: [
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader'
},
(...)
}
.babelrc
:
{
"presets": ["es2015"],
"plugins": ["syntax-dynamic-import", "transform-runtime"]
}
package.json
:
"devDependencies": {
"autoprefixer": "~6.5.3",
"babel": "^6.5.2",
"babel-cli": "~6.18.0",
"babel-core": "^6.25.0",
"babel-loader": "^7.1.1",
"babel-plugin-syntax-dynamic-import": "^6.18.0",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-es2015": "^6.18.0",
"node-sass": "^4.5.3",
"noty": "~2.4.0",
"path": "~0.12.7",
"promise-polyfill": "~6.0.2",
"resolve-url-loader": "~1.6.0",
"sass-loader": "~4.0.2",
"style-loader": "~0.13.1",
"stylelint": "~7.6.0",
"tag-it": "~2.0.0",
"url-loader": "~0.5.7",
"webpack": "^3.0.0",
"webpack-dev-server": "~2.2.1",
"webpack-uglify-js-plugin": "~1.1.9",
"whatwg-fetch": "~2.0.2"
},
Turned out my .babelrc
was ignored, because this file (and webpack) was outside of my project's root directory. I fixed it by adding path to config file in webpack.config.js
to babel-loader
:
{
test: /\.js$/,
exclude: /node_modules/,
use: 'babel-loader?extends='+path.resolve('./.babelrc')
}