我有一个要在其中index.js构建的轮播文件block.build.js,所以我webpack.config.js是:
index.js
block.build.js
webpack.config.js
var config = { entry: './index.js', output: { path: __dirname, filename: 'block.build.js', }, devServer: { contentBase: './Carousel' }, module : { rules : [ { test: /.js$/, loader: 'babel-loader', exclude: /node_modules/, query: { presets: ['react', 'es2015'], plugins: ['transform-class-properties'] } } ] } }; module.exports = config;
在package.json我使用低于:
package.json
{ "name": "carousel", "version": "1.0.0", "description": "", "main": "webpack.config.js", "dependencies": { "@babel/core": "^7.0.0-beta.40", "babel-cli": "^6.26.0", "babel-loader": "^8.0.0-beta.0", "babel-plugin-lodash": "^3.3.2", "babel-plugin-react-transform": "^3.0.0", "babel-preset-react": "^6.24.1", "cross-env": "^5.1.3", "lodash": "^4.17.5", "react": "^16.2.0", "react-dom": "^16.2.0", "react-swipeable": "^4.2.0", "styled-components": "^3.2.1" }, "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "watch": "webpack --watch", "start": "webpack-dev-server --open", "build": "webpack" }, "devDependencies": { "webpack": "^4.1.1", "webpack-cli": "^2.0.10", "webpack-dev-server": "^3.1.0" }, "author": "brad traversy", "license": "ISC" }
…但是我收到此错误消息:
ERROR in ./index.js Module build failed: Error: Plugin/Preset files are not allowed to export objects, only functions.
有谁知道如何解决这个问题?
您使用的是Babel 6和Babel 7的组合。不能保证各个版本之间的兼容性:
"@babel/core": "^7.0.0-beta.40", "babel-cli": "^6.26.0", "babel-loader": "^8.0.0-beta.0", "babel-plugin-lodash": "^3.3.2", "babel-plugin-react-transform": "^3.0.0", "babel-preset-react": "^6.24.1",
应该
"@babel/core": "^7.0.0-beta.40", "@babel/cli": "^7.0.0-beta.40", "babel-loader": "^8.0.0-beta.0", "babel-plugin-lodash": "^3.3.2", "babel-plugin-react-transform": "^3.0.0", "@babel/preset-react": "^7.0.0-beta.40",
和
query: { presets: ['react', 'es2015'], plugins: ['transform-class-properties'] }
将是
query: { presets: ['@babel/react', '@babel/es2015'], plugins: ['@babel/proposal-class-properties'] }
我也很困惑,因为您没有@babel/proposal-class- properties在中提及package.json,但是假设它在其中也应该进行更新。
@babel/proposal-class- properties