IE/Edge 中的 Babel 7 传播语法不起作用
Babel 7 spread syntax in IE/Edge not working
所以我安装了 babel 7,以及我的 preset-env 中包含的插件“@babel/plugin-proposal-object-rest-spread”,但是我仍然收到以下错误,因为它没有将我的传播运算符转译回来进入 es2015.
SCRIPT1028: Expected identifier, string or number
我尝试在我的 .babelrc 文件中引用插件数组中的插件。
我的 .babelrc 文件:
{
"presets": [
"@babel/preset-react",
"@babel/preset-env", {
"include": [
"@babel/plugin-proposal-object-rest-spread"
]
}
],
"plugins": [
"@babel/plugin-syntax-dynamic-import",
"@babel/plugin-syntax-import-meta",
"@babel/plugin-proposal-class-properties",
"@babel/plugin-proposal-json-strings",
]
}
我的 package.json dependencies/dev 依赖项:
"dependencies": {
"@babel/polyfill": "^7.2.5",
"axios": "^0.18.0",
"babel-polyfill": "^6.26.0",
"bootstrap": "^4.1.3",
"core-js": "^2.6.3",
"dotenv": "^6.1.0",
"get-base64": "^1.3.0",
"history": "^4.7.2",
"moment": "^2.22.2",
"prop-types": "^15.6.2",
"qs": "^6.5.2",
"react": "^16.6.0",
"react-debounce-input": "^3.2.0",
"react-dom": "^16.6.0",
"react-onclickoutside": "^6.7.1",
"react-redux": "^5.1.0",
"react-router-dom": "^4.3.1",
"react-router-redux": "^4.0.8",
"react-select": "^2.1.2",
"redux": "^4.0.1",
"redux-devtools-extension": "^2.13.5",
"redux-thunk": "^2.3.0",
"svg-url-loader": "^2.3.2",
"webpack": "^4.23.1",
"webpack-cli": "^3.1.2",
"webpack-dev-server": "^3.1.14",
"webpack-merge": "^4.1.4"
},
"devDependencies": {
"@babel/core": "^7.0.0",
"@babel/plugin-proposal-class-properties": "^7.0.0",
"@babel/plugin-proposal-json-strings": "^7.0.0",
"@babel/plugin-proposal-object-rest-spread": "^7.3.1",
"@babel/plugin-syntax-dynamic-import": "^7.0.0",
"@babel/plugin-syntax-import-meta": "^7.0.0",
"@babel/preset-env": "^7.0.0",
"@babel/preset-react": "^7.0.0",
"babel-eslint": "^9.0.0",
"babel-loader": "^8.0.0",
"babel-plugin-transform-es2015-destructuring": "^6.23.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"copy-webpack-plugin": "^4.6.0",
"css-loader": "^1.0.0",
"eslint": "^5.8.0",
"eslint-config-airbnb": "^17.1.0",
"eslint-plugin-import": "^2.14.0",
"eslint-plugin-jsx-a11y": "^6.1.2",
"eslint-plugin-react": "^7.11.1",
"file-loader": "^2.0.0",
"html-webpack-plugin": "^3.2.0",
"interpolate-html-plugin": "^3.0.0",
"node-sass": "^4.9.4",
"optimize-css-assets-webpack-plugin": "^5.0.1",
"sass-loader": "^7.1.0",
"style-loader": "^0.23.1",
"uglify-es-webpack-plugin": "^0.10.0",
"url-loader": "^1.1.2"
看起来您正在使用 Webpack,并且您已经安装了 babel-loader
。
既然如此,这里有两件事需要快速检查:
- 你确定你在 js 文件的 webpack 配置中使用那个加载器吗?
rules: [
{
test: /\.jsx?$/,
loader: 'babel-loader',
exclude: /node_modules/,
},
],
- 是否有任何 js 资产绕过 Webpack,"missing out" 在那个加载器上?
- (编辑):如果对那些 "no",您是否还需要
"@babel/plugin-transform-spread"
来捕获数组中的点差,因为 "@babel/plugin-proposal-object-rest-spread"
是特定于对象的?
所以我安装了 babel 7,以及我的 preset-env 中包含的插件“@babel/plugin-proposal-object-rest-spread”,但是我仍然收到以下错误,因为它没有将我的传播运算符转译回来进入 es2015.
SCRIPT1028: Expected identifier, string or number
我尝试在我的 .babelrc 文件中引用插件数组中的插件。
我的 .babelrc 文件:
{
"presets": [
"@babel/preset-react",
"@babel/preset-env", {
"include": [
"@babel/plugin-proposal-object-rest-spread"
]
}
],
"plugins": [
"@babel/plugin-syntax-dynamic-import",
"@babel/plugin-syntax-import-meta",
"@babel/plugin-proposal-class-properties",
"@babel/plugin-proposal-json-strings",
]
}
我的 package.json dependencies/dev 依赖项:
"dependencies": {
"@babel/polyfill": "^7.2.5",
"axios": "^0.18.0",
"babel-polyfill": "^6.26.0",
"bootstrap": "^4.1.3",
"core-js": "^2.6.3",
"dotenv": "^6.1.0",
"get-base64": "^1.3.0",
"history": "^4.7.2",
"moment": "^2.22.2",
"prop-types": "^15.6.2",
"qs": "^6.5.2",
"react": "^16.6.0",
"react-debounce-input": "^3.2.0",
"react-dom": "^16.6.0",
"react-onclickoutside": "^6.7.1",
"react-redux": "^5.1.0",
"react-router-dom": "^4.3.1",
"react-router-redux": "^4.0.8",
"react-select": "^2.1.2",
"redux": "^4.0.1",
"redux-devtools-extension": "^2.13.5",
"redux-thunk": "^2.3.0",
"svg-url-loader": "^2.3.2",
"webpack": "^4.23.1",
"webpack-cli": "^3.1.2",
"webpack-dev-server": "^3.1.14",
"webpack-merge": "^4.1.4"
},
"devDependencies": {
"@babel/core": "^7.0.0",
"@babel/plugin-proposal-class-properties": "^7.0.0",
"@babel/plugin-proposal-json-strings": "^7.0.0",
"@babel/plugin-proposal-object-rest-spread": "^7.3.1",
"@babel/plugin-syntax-dynamic-import": "^7.0.0",
"@babel/plugin-syntax-import-meta": "^7.0.0",
"@babel/preset-env": "^7.0.0",
"@babel/preset-react": "^7.0.0",
"babel-eslint": "^9.0.0",
"babel-loader": "^8.0.0",
"babel-plugin-transform-es2015-destructuring": "^6.23.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"copy-webpack-plugin": "^4.6.0",
"css-loader": "^1.0.0",
"eslint": "^5.8.0",
"eslint-config-airbnb": "^17.1.0",
"eslint-plugin-import": "^2.14.0",
"eslint-plugin-jsx-a11y": "^6.1.2",
"eslint-plugin-react": "^7.11.1",
"file-loader": "^2.0.0",
"html-webpack-plugin": "^3.2.0",
"interpolate-html-plugin": "^3.0.0",
"node-sass": "^4.9.4",
"optimize-css-assets-webpack-plugin": "^5.0.1",
"sass-loader": "^7.1.0",
"style-loader": "^0.23.1",
"uglify-es-webpack-plugin": "^0.10.0",
"url-loader": "^1.1.2"
看起来您正在使用 Webpack,并且您已经安装了 babel-loader
。
既然如此,这里有两件事需要快速检查:
- 你确定你在 js 文件的 webpack 配置中使用那个加载器吗?
rules: [
{
test: /\.jsx?$/,
loader: 'babel-loader',
exclude: /node_modules/,
},
],
- 是否有任何 js 资产绕过 Webpack,"missing out" 在那个加载器上?
- (编辑):如果对那些 "no",您是否还需要
"@babel/plugin-transform-spread"
来捕获数组中的点差,因为"@babel/plugin-proposal-object-rest-spread"
是特定于对象的?