在vue项目中使用如sass、less、stylus时需要进行公共变量、方法的集中维护

vue-cli3.0构建的服务使用如下方法可直接在每个css中引入公共变量、方法
此处只说明了style 的引入,其他less sass引入在vue-cli3.0文档中有说明

// vue.config.js 文件

module.exports = {
  css: {
    loaderOptions: {
      // 给 stylus-loader 传递选项
      stylus: {
       // @/ 是 src/ 的别名
        // 所以这里假设你有 `src/common/stylus/color.styl` 这个文件,需要在没有vue文件中import
        import: '~@/common/stylus/color.styl'
      }
    }
  }
}
// .vue文件的 会在loader后在 <style lang="stylus"> 头部插入import src/common/stylus/color.styl
// 缺少loader直接npm安装到开发环境就可以了
Logo

前往低代码交流专区

更多推荐