less全局变量配置

Posted 2023-03-30

参考技术A 基于当前less跟less-loader版本如下
1.安装less跟less-loader

2.安装style-resources-loader 和 vue-cli-plugin-style-resources-loader

3.修改vue.config.js如下

4.重启项目

启动成功，没有报错

vue3.0cli 配置全局的less变量

 

 1 npm install style-resources-loader //首先安装
 2 const path = require(‘path‘)
 3 module.exports = {
 4   chainWebpack: config=> {
 5     config.module.rule(‘less‘).oneOf(‘vue‘).use(‘style-resource‘)
 6     .loader(‘style-resources-loader‘)
 7     .options({
 8         patterns: [
 9             path.resolve(__dirname, ‘./src/assets/style/variabel.less‘),//这个是自己文件的路径
10         ],
11     })
12 },
13 css: {
14     loaderOptions: {
15         less: {
16             javascriptEnabled: true
17         }
18     }
19 }
20 }