I want to try dynamic import (https://developers.google.com/web/updates/2017/11/dynamic-import) at my project.
module.exports = {
env: {
browser: true
},
parser: 'babel-eslint',
parserOptions: {
ecmaVersion: 9,
sourceType: 'module',
ecmaFeatures: {
jsx: true,
impliedStrict: true
}
},
plugins: ['react', 'babel'],
extends: ['airbnb'].concat([
'./rules/best-practices',
'./rules/es6',
'./rules/possible-errors',
'./rules/strict-mode',
'./rules/stylistic-issues',
'./rules/variables'
].map(require.resolve)).concat([
'./rules/react',
'./rules/babel'
].map(require.resolve))
};
{
"presets": [["env", {
"debug": false,
"modules": false
}], "stage-0", "react"],
"plugins": [
"react-hot-loader/babel",
"syntax-dynamic-import",
"transform-class-properties",
"transform-decorators-legacy"
]
}
"babel-core": "^6.26.0",
"babel-eslint": "^8.2.2",
"babel-loader": "^7.1.4",
"babel-plugin-syntax-dynamic-import": "^6.18.0",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-plugin-transform-flow-strip-types": "^6.22.0",
"babel-preset-env": "^1.6.1",
"babel-preset-flow": "^6.23.0",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"eslint": "^4.18.2",
"eslint-config-airbnb": "^16.1.0",
"eslint-loader": "^2.0.0",
"eslint-nibble": "^4.2.1",
"eslint-plugin-babel": "^4.1.2",
"eslint-plugin-flowtype": "^2.46.1",
"eslint-plugin-import": "^2.9.0",
"eslint-plugin-jsx-a11y": "^6.0.3",
"eslint-plugin-react": "^7.7.0",
if (module.hot) {
module.hot.accept('../reducers', () => {
// eslint-disable-next-line global-require
// const rootReducer = require('../reducers').default;
const rootReducer = await import('../reducers');
store.replaceReducer(rootReducer);
});
But get an error from eslint Parsing error: await is a reserved word
await can only be used inside async fuctions (async function foo() {} or async () => {}),
@nicolo-ribaudo That's what I have but am still getting the error.
module.hot.accept('../reducers', **async** () => {
// eslint-disable-next-line global-require
// const rootReducer = require('../reducers').default;
const rootReducer = await import('../reducers');
store.replaceReducer(rootReducer);
});
Have you tried to add the async in your arraw function?
_await_ can't be used elsewhere.
Forgot about this issue, but yeah I think that was it - forgetting to make the callback function async
It would be nice if babel could say "await can only be used if the function is marked async" instead of this cryptic error.
For anyone stumbling across this issue, improving the error output caused by using await in a non-async function is tracked by https://github.com/babel/babel/issues/6720
Most helpful comment
It would be nice if babel could say "await can only be used if the function is marked async" instead of this cryptic error.