步骤1:
项目中添加less插件
npm install --save less less-loader
步骤2:
配置公共样式
****.less
*{
font-size: 14px;
}
步骤3:
安装style-resources-loader插件
config文件夹下webpack.config.js内配置less样式
const lessRegex = /\.less$/;
const lessModuleRegex = /\.module\.less$/;
const lessGlobalUrl = "./../src/*****.less";
************
module: {
strictExportPresence: true,
rules: [
************
{
test: lessRegex,
exclude: cssModuleRegex,
use: [
...getStyleLoaders(
{
importLoaders: 3,
sourceMap: isEnvProduction
? shouldUseSourceMap
: isEnvDevelopment,
},
'less-loader'
),
{
loader: 'style-resources-loader',
options: {
patterns: path.resolve(__dirname, lessGlobalUrl),
},
},
],
sideEffects: true,
},
{
test: lessModuleRegex,
use: [
...getStyleLoaders(
{
importLoaders: 3,
sourceMap: isEnvProduction
? shouldUseSourceMap
: isEnvDevelopment,
modules: {
getLocalIdent: getCSSModuleLocalIdent,
},
},
'less-loader'
),
{
loader: 'style-resources-loader',
options: {
patterns: path.resolve(__dirname, lessGlobalUrl),
},
},
],
},
***************