默认情况下,webpack无法直接打包less语法, 需要结合less-loader处理
// webpack.config.js
const miniCssExtractPlugin = require('mini-css-extract-plugin')
module.exports = {
entry: './src/index.js',
output: {
filename: 'main.js',
},
module: {
rules: [{
test: /\.less$/i,
use: [
// 'style-loader',
miniCssExtractPlugin.loader,
'css-loader', 'less-loader']
}]
},
plugins: [
new miniCssExtractPlugin({
filename: '[name].css',
chunkFilename: '[id].css'
})
]
}
src/index.js
import './style.less'
src/style.less
.body {
div {
background-color: red;
}
}