vuecli 4.5 配置公共scss样式文件

首先安装npm install sass-resources-loader -D

然后建立自己的scss文件,_variables.scss,随便码个$blue:blue

再在vue.config.js中加入

chainWebpack: (config) => {
    const oneOfsMap = config.module.rule("scss").oneOfs.store;
    oneOfsMap.forEach((item) => {
      item
        .use("sass-resources-loader")
        .loader("sass-resources-loader")
        .options({
          // 要公用的scss的路径
          resources: "src/styles/_variables.scss",
        })
        .end();
    });
  },

最后在组件中

<style lang="scss">

.a{color:$blue}

</style>

posted @ 2021-01-29 11:10  认真的老鱼儿  阅读(720)  评论(1)    收藏  举报