在做vue项目的时候,有时候需要用到一些公共的less样式,这时候全局配置好过局部配置,在全局配置的时候,试过直接在main.js引入less的公共文件;
在这里插入图片描述
也试过在vue.config.js文件中配置css属性:
在这里插入图片描述
但是上面这两种方式都报错,直到尝试了以下方法:

const path = require(‘path’)
module.exports = {
chainWebpack: config => {
const types = [‘vue-modules’, ‘vue’, ‘normal-modules’, ‘normal’]
types.forEach(type => addStyleResource(config.module.rule(‘less’).oneOf(type)))
}
}

function addStyleResource(rule) { rule.use(‘style-resource’)
.loader(‘style-resources-loader’) .options({ patterns: [
path.resolve(__dirname, ‘./src/assets/less/public.less’), // 需要全局导入的less ], }) }

这种方法是可以实现全局配置的。

Logo

前往低代码交流专区

更多推荐