Vue 配置scss自动导入

参考

【精选】如何在vue项目中引入scss

unplugin-auto-import在vue3项目实践及报错处理 - 掘金 (juejin.cn)

环境搭建

安装scss: npm install sass node-sass sass-loader

创建变量文件:

vue 引用 scss 变量

组件页面:

配置自动导入

注意:修改后需要重启项目!!!

css 复制代码
 css:{
    preprocessorOptions: {
      scss: {
        additionalData: `
          @use "@/styles/var.scss" as *;
        `,
      }
    }
  }

添加后不加import也可使用全局变量

相关推荐
前端老石人2 分钟前
前端开发中的 URL 完全指南
开发语言·前端·javascript·css·html
CAE虚拟与现实3 分钟前
五一假期闲来无事,来个前段、后端的说明吧
前端·后端·vtk·three.js·前后端
Sarvartha13 分钟前
三目运算符
linux·服务器·前端
晓晨的博客21 分钟前
ROS1录制的bag包转换为ROS2格式
前端·chrome
Wect28 分钟前
LeetCode 72. 编辑距离:动态规划经典题解
前端·算法·typescript
donecoding42 分钟前
别再让 pnpm 跟着 nvm 跑了!独立安装终极指南
前端·node.js·前端工程化
GISer_Jing43 分钟前
AI全栈转型_TS后端学习路线
前端·人工智能·后端·学习
竹林81844 分钟前
被The Graph的GraphQL查询坑了三天,我用一个真实DeFi项目把链上数据索引彻底搞懂了
前端·graphql
漫游的渔夫44 分钟前
前端开发者做 Agent:别只会执行,用 4 类失败策略让 AI 知道怎么停
前端·人工智能·typescript
用户059540174461 小时前
把多级缓存一致性验证从手工测试换成 Pytest 参数化,Bug 排查时间缩短 90%
前端·css