vue配置全局less变量
一、使用vite开发时的配置
配置 vue.config.js
import {defineConfig} from 'vite'; import vue from '@vitejs/plugin-vue'; import path from 'path'; export default defineConfig({ server: { port: 8080, }, plugins: [vue()], resolve: { alias: { "@": path.resolve(__dirname, "src"), "comps": path.resolve(__dirname, "src/components"), }, }, css: { preprocessorOptions: { less: { additionalData: '@import "./src/assets/css/variables.less";' + '@import "./src/assets/css/mixins.less";' } } } })
二、使用vue-cli开发时的配置
参考网站:https://blog.csdn.net/weixin_33483304/article/details/112030147
需要安装两个包开发依赖的包:style-resources-loader,vue-cli-plugin-style-resources-loader
yarn add style-resources-loader vue-cli-plugin-style-resources-loader -D
配置 vue.config.js
const path = require('path'); module.exports = { pluginOptions: { "style-resources-loader": { preProcessor: "less", patterns: [ path.resolve(__dirname, "./src/assets/css/variables.less") ] } } }