Reactjs “上的网页包配置错误”;开发工具:';源地图'&引用;
我正在尝试教科书反应应用程序如下。但是,当我运行命令Reactjs “上的网页包配置错误”;开发工具:';源地图'&引用;,reactjs,npm,webpack,Reactjs,Npm,Webpack,我正在尝试教科书反应应用程序如下。但是,当我运行命令sh-cwebpack--watch-d--output./target/classes/static/build/bundle.js(npm run script watch,如教程中所述)时,我得到了以下错误 [webpack-cli] Invalid configuration object. Webpack has been initialized using a configuration object that does not m
sh-cwebpack--watch-d--output./target/classes/static/build/bundle.js
(npm run script watch
,如教程中所述)时,我得到了以下错误
[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如下所示
let path = require('path');
module.exports = {
entry: './src/main/js/App.js',
devtool: 'source-map',
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.29.0。Webpack--watch-d--output./target/classes/static/build/bundle.js
这里-d表示devtool选项,它覆盖了文件中给出的选项。在webpack 5中,不能将empty传递给devtool
这就是问题所在