reactjs - 在最新版本的 webpack 上运行脚本监视 - 无效的配置对象
问题描述
运行此命令时
npm run-script watch
我有这个错误
npm ERR! command sh -c webpack --watch -d --output ./target/classes/static/built/bundle.js
和这个
[webpack-cli] Invalid configuration object. Webpack has been initialized using a configuration object that does not match the API schema.
- configuration.devtool should match pattern "^(inline-|hidden-|eval-)?(nosources-)?(cheap-(module-)?)?source-map$".
BREAKING CHANGE since webpack 5: The devtool option is more strict.
Please strictly follow the order of the keywords in the pattern.
我的 webpack.config.js
var path = require('path');
module.exports = {
entry: './src/main/js/App.js',
cache: true,
mode: 'development',
output: {
path: __dirname,
filename: './src/main/resources/static/built/bundle.js'
},
module: {
rules: [
{
test: path.join(__dirname, '.'),
exclude: /(node_modules)/,
use: [{
loader: 'babel-loader',
options: {
presets: ["@babel/preset-env", "@babel/preset-react"]
}
}]
},
{
test: /\.css$/,
use: [
'style-loader',
'css-loader'
]
},
{
test: /\.(png|svg|jpg|gif|eot|otf|ttf|woff|woff2)$/,
use: [
{
loader: 'url-loader',
options: {}
}
]
}
]
}
};
知道为什么吗?
使用
“webpack”:“^5.25.0”,“webpack-cli”:“^4.5.0”
谢谢,
解决方案
它写在你的错误中。您必须为“devtool”指定值。如果你想使用 flag -d
(缩写--devtool
),你必须指出它的值:https ://webpack.js.org/configuration/devtool/#devtool
推荐阅读
- asp.net-mvc - MVC - 将数据加载到模态中
- firebase - 图像在 Android 和 IOS 设备的 Ionic Virtual Scrolling 中消失
- java - Android Studio Ugly Font(抗锯齿)
- java - 如果语句不考虑 Array list out of bounds 异常
- javascript - 如何将 lodash 导入 NativeScript Playground
- java - Selenium Java:从 h1 标记中检索文本
- amazon-web-services - AWS codebuild 是否支持代理
- ruby-on-rails - Rails 使用它与多个属性进行多态关联
- jquery - 动态创建的内联样式的 JQuery 测试
- azure-functions - 处理 Azure 计时器函数中的异常