我想告诉你我的问题。
我的环境:
Node: 8.9.1 npm: 5.6.0 yarn: 1.3.2
package.json
"devDependencies": { "babel-core": "^6.26.0", "babel-loader": "^7.1.2", "babel-plugin-transform-object-rest-spread": "^6.26.0", "babel-preset-env": "^1.6.1", "babel-preset-react": "^6.24.1", "copy-webpack-plugin": "^4.1.1", ... "webpack": "^3.7.1", "webpack-dev-server": "^2.9.2" },
webpack.config.js
... module: { rules: [ { test: /\.(js|jsx)$/, exclude: /node_modules/, use: { loader: 'babel-loader', options: { cacheDirectory: true, presets: ['react', 'env'] } } }, ...
总是像这样在{…}
./src/flux/components/BaseComponent.js中的错误模块构建失败:语法错误:D:/APPs/src/flux/components/BaseComponent.js:意外令牌(36:29) 34 | let {search} = this.state; 35 | search.includeActive = !search.includeActive; > 36 | this.setState({category : {...this.state.category, name : name}}); |
./src/flux/components/BaseComponent.js中的错误模块构建失败:语法错误:D:/APPs/src/flux/components/BaseComponent.js:意外令牌(36:29)
34 | let {search} = this.state; 35 | search.includeActive = !search.includeActive; > 36 | this.setState({category : {...this.state.category, name :
name}});
|
但是,如果没有webpack,它会很好地工作。请帮我解决这个问题!非常感谢大家!:)
为了使用扩展语法,您需要配置babel loader,您有几个选择
第一: 使用插件"transform-object-rest-spread"
"transform-object-rest-spread"
使用安装
npm install --save-dev babel-plugin-transform-object-rest-spread
并使用它
options: { cacheDirectory: true, presets: ['react', 'env'] plugins: ['transform-object-rest-spread'] }
第二: 使用stage-0预设,使用
stage-0
npm install --save-dev babel-preset-stage-0
并像这样使用
options: { cacheDirectory: true, presets: ['react', 'env', 'stage-0'] }
检查 此babel文档