vue.config.js css loaderOptions的用处

瑕疵

已于 2022-03-11 13:42:47 修改

阅读量5.2k

点赞数 3

CC 4.0 BY-SA版权

分类专栏： # vue 文章标签： css vue.js html less

于 2021-10-10 14:25:50 首次发布

本文链接：https://blog.csdn.net/qq_36287830/article/details/120685945

vue 专栏收录该内容

42 篇文章

订阅专栏

通过vue.config.js中的css.loaderOptions，可以方便地向webpack的预处理器如Less传递选项，实现快速更改样式。例如设置`primary-color`、`border-color-base`和`border-radius-base`等全局变量，使得在less文件中可以直接使用这些自定义样式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

 css: {
    loaderOptions: {
      less: {
        modifyVars: {
          "primary-color": "#6EBF89",//全局变量 可以快速更改样式 
          //直接在less文件中@primary-color使用
          "border-color-base": "#dddddd",
          "border-radius-base": "5px"
        },
        javascriptEnabled: true
      }
    }
  },