uniapp全局引用less的变量
uni-app官方文档直达vue.config.js是一个可选的配置文件,如果项目的 (和package.json同级的) 根目录中存在这个文件,那么它会被@vue/cli-service自动加载。你也可以使用package.json中的vue字段,但是注意这种写法需要你严格遵照 JSON 的格式来写。(摘自官方文档)也就是先创建一个vue.config.js文件,才能进行配置,话不多说,直接上图
·
PS:因为修改的是配置文件config,所以修改完切记重新编译!!重新编译!!重新编译!!
vue.config.js
是一个可选的配置文件,如果项目的 (和 package.json
同级的) 根目录中存在这个文件,那么它会被 @vue/cli-service
自动加载。你也可以使用 package.json
中的 vue
字段,但是注意这种写法需要你严格遵照 JSON 的格式来写。(摘自官方文档)
也就是先创建一个vue.config.js文件,才能进行配置,话不多说,直接上图
// vue.config.js
let path = require('path');
let stylePath = path.resolve(__dirname, 'common/common.less') // common/common.less是less的路径
module.exports = {
css: {
loaderOptions: {
less: {
globalVars: {
"hack": `true; @import "${stylePath}"`
}
}
}
},
}
好了,解决完之后再了解下为什么要这么做,因为less再App.vue直接@import的话,只能有样式可以用,而less的变量用不了,如果不配置config的话,要使用变量的话只能在每个组件单独引入。
更多推荐
已为社区贡献1条内容
所有评论(0)