解决React中css-loader中的 options has an unknown property 'localIdentName'. These properties are valid报错问题
解决代码如下:
const path = require('path') //引入path模块
const HtmlWebpackPlugin = require('html-webpack-plugin') //引入html-webpack-plugin模块
const htmlplugin = new HtmlWebpackPlugin({
template: path.join(__dirname, '/src/index.html'), //源文件
filename: 'index.html' //生成的问题
})
module.exports = {
mode: 'development', //production生产版用这个 development开发版用这个
plugins: [
htmlplugin
],
module: {
rules: [
{//解析jsx语法
test: /\.js|jsx$/,
use: 'babel-loader',
exclude: /node_modules/
},
{//解析css样式
test: /\.css$/,
use: [
'style-loader',
{
loader: 'css-loader',
//获取localIdentName
options: {
modules: {
localIdentName: '[path]'
},
}
}
]
}
],
},
resolve: {
extensions: ['.js', '.jsx', 'json'],
alias: {
"@": path.join(__dirname, '/src')
}
}
}
报错图片如下:
css-loader更新后, 获取localIdentName不再是在后面跟参数获取, 而是进行分开,
更新前: { test: /\.css$/, use: ['style-loader', 'css-loader?modules&localIdentName=[path][name]-[local]-[hash:5]'] },
更新后: { test: /\.css$/,use: ['style-loader',{ loader: 'css-loader',options: {modules: { localIdentName: '[path]'},}}] }