Skip to content

Fakin's Blog

  • 首页
  • 前端
    • Vue
    • React
    • JavaScript
    • CSS
  • 技术
    • 织梦教程
  • 模板
    • 织梦模板
    • wordpress主题
  • 资源
  • 日记
  • 友链

vue-cli3.0配置scss全局变量

九月 23, 2019 by Fakin

1、使用sass-loader

module.exports = {
css: {
        loaderOptions: {
            // 设置 scss 公用变量文件
            sass: {
                prependData: `@import '~@/common/scss/variables.scss';` //新版本
                data: `@import '~@/common/scss/variables.scss';` //旧版本
            }
        },
        extract: true,
        sourceMap: false
    }
}

2、style-resources-loader

npm i style-resources-loader -D

过后会在vue.config.js中自动生成代码

const path=require('path')
pluginOtions:{
"style-resources-loader": {
            preProcessor: "scss",
            patterns: [
              //这个是加上自己的路径
              path.resolve(__dirname, "./src/assets/variable.scss")
             ]
         }
}


Post navigation

上一篇:

uni-app跨域设置

下一篇:

uni-app国际化

最近文章

  • 仿element-ui中Layout 布局-xcLayout
  • node-sass-error 解决方法
  • 自我ESLint配置【仅供参考】
  • JavaScript实用工具库【持续更新】
  • vue技巧【持续更新】
  • uni-app中picker组件“确定”和“取消”文字的修改
  • uni-app国际化
  • vue-cli3.0配置scss全局变量

最近评论

  • 心灵博客发表在《JavaScript实用工具库【持续更新】》
  • Teacher Du发表在《友情链接》
  • 火辣辣发表在《友情链接》
  • 心灵博客发表在《uni-app跨域设置》
  • 腾讯云代金券发表在《element ui+七牛云上传》

更新日历

2021年一月
一 二 三 四 五 六 日
« 4月    
 123
45678910
11121314151617
18192021222324
25262728293031
© 2021 Fakin's Blog         | WordPress Theme by SuperbThemes | 蜀ICP备16017838号-2