vite配置自动引入全局scss变量文件

全局自动引入scss变量文件

当定义了全局的scss变量文件并且而其他很多页面都需要使用的时候,都需要显式的使用@import或者@use引用一遍全局scss文件,很是麻烦。
使用以下配置这样能有效避免造成大量重复工作,可以在任何scss文件中任意使用全局变量。

  1. 定义全局scss变量文件image

  2. 配置vite.config的css预处理的选项!image

     css:{
    	preprocessorOptions: {
    	  scss: {
    		additionalData: `@use "src/assets/style/globalColor.scss" as *;`
    	  }
    	}
      }
    
  3. 可在任意scss文件中使用
    image

image

posted @   李嘉图呀  阅读(2379)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· PowerShell开发游戏 · 打蜜蜂
· 在鹅厂做java开发是什么体验
· 百万级群聊的设计实践
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战
· 永远不要相信用户的输入:从 SQL 注入攻防看输入验证的重要性
点击右上角即可分享
微信分享提示