無效的配置 object。 Webpack 已使用與 Z217C80CED05A5D1172B666Z 中的 API 模式不匹配的配置 object 進行了初始化

Question

由於配置 object 與 API 架構不匹配，無法構建生產模式。 將 webpack@3.0.0 更新到版本 webpack@4.40.2 后發生錯誤。 我更新了 webpack 版本，因為 extract-text-webpack-plugin 與 webpack@3.0.0 不兼容。

以下是我運行 yarn run build:prod 時的終端錯誤（生產模式）

下面是 webpack.config.js 文件

 const path = require('path'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); module.exports = (env)=>{ const isProduction = env === 'production'; const CSSExtract = new ExtractTextPlugin('styles.css'); console.log('env', env); return { entry: './src/app.js', output: { path: path.join(__dirname, 'public'), filename: 'bundle.js' }, module: { rules: [{ loader: 'babel-loader', test: /\.js$/, exclude: /node_modules/ },{ test: /\.s?css$/, use: CSSExtract.extract({ use: [ 'css-loader', 'sass-loader' ] }) }] }, plugin: [ CSSExtract ], devtool: isProduction? 'source-map': 'cheap-module-eval-source-map', devServer: { contentBase: path.join(__dirname, 'public'), historyApiFallback: true } } };

下面是 package.json 文件

 { "name": "expensify-app", "version": "1.0.0", "main": "index.js", "author": "Andrew Mead", "license": "MIT", "scripts": { "serve": "live-server public/", "build:dev": "webpack", "build:prod": "webpack -p --env production", "dev-server": "webpack-dev-server", "test": "jest" }, "dependencies": { "babel-cli": "6.24.1", "babel-core": "6.25.0", "babel-loader": "7.1.1", "babel-plugin-transform-class-properties": "6.24.1", "babel-plugin-transform-object-rest-spread": "^6.26.0", "babel-preset-env": "1.5.2", "babel-preset-react": "6.24.1", "css-loader": "0.28.4", "enzyme": "3.0.0", "enzyme-adapter-react-16": "1.0.0", "jest": "20.0.4", "live-server": "^1.2.0", "moment": "^2.24.0", "node-sass": "4.5.3", "normalize.css": "7.0.0", "npm": "^6.11.3", "raf": "3.3.2", "react": "16.0.0", "react-addons-shallow-compare": "^15.6.2", "react-dates": "^21.1.0", "react-dom": "16.0.0", "react-modal": "2.2.2", "react-redux": "5.0.5", "react-router-dom": "^5.0.1", "react-test-renderer": "16.0.0", "redux": "^4.0.4", "sass-loader": "6.0.6", "style-loader": "0.18.2", "uuid": "^3.3.3", "validator": "8.0.0", "webpack": "^4.40.2", "webpack-dev-server": "2.5.1" }, "devDependencies": { "extract-text-webpack-plugin": "^3.0.2", "webpack-cli": "^3.3.9" } }

Answer 1

在 Webpack 配置中將“插件”更改為“插件”