技术栈

vue3.0 + vite:中使用 sass

天外天-亮2024-10-14 8:37

1、安装依赖

npm i sass sass-loader --save-dev

在项目的src/assets文件夹下新建style/index.scss 文件

2、在 vite.config.ts 中加:

复制代码
resolve: {
  alias: {
    '@': fileURLToPath(new URL('./src', import.meta.url))
  }
},
css: {
  // 配置 SCSS 支持
  preprocessorOptions: {
    scss: {
      additionalData: `@use "@/assets/index.scss" as *;`
    }
  }
}

3、在组件再直接引用即可

上一篇:致阿里云:我有一个小需求,请帮忙去掉AI助手
下一篇:MySQL数据的导出
相关推荐
不吃鱼的羊
19 分钟前
DaVinci配置NVM模块
前端·javascript·网络
excel
29 分钟前
为什么需要构建工具(Webpack / Vite 的本质)
前端
lang20150928
29 分钟前
Java SAX 流式解析全解:从原理到 EasyExcel 实战
java·前端·javascript
Rain509
37 分钟前
2.4. PostgreSQL 数据库连接与实战指南
前端·数据库·人工智能·后端·postgresql·数据分析
console.log('npc')
37 分钟前
Codex 桌面端接入 Headroom 压缩代理完整教程
前端·vscode
独泪了无痕
1 小时前
Vue集成uuid生成唯一标识实践指南
前端·vue.js
yuanyxh
9 小时前
Mac 软件推荐
前端·javascript·程序员
万少
9 小时前
AtomCode开发微信小程序《谁去呀》 全流程
前端·javascript·后端
某人辛木
9 小时前
Web自动化测试
前端·python·pycharm·pytest
Kagol
10 小时前
Superpowers GSD gstack AgentSkills深度测评
前端·人工智能
热门推荐
012026年6月AI行业全景:从百模大战到Agent元年,这30天发生了什么?02HTTP 与 HTTPS 的区别:从原理到实战详解032026 AI 编程工具终极实战指南:Cursor vs Claude Code vs Copilot,开发者该怎么选?042026 年 AI 编程工具终极横评:Cursor vs Claude Code vs Copilot vs Windsurf05【AI】2026 年具身智能模型和世界模型总结06GitHub 镜像站点07AI科技热点日报 | 2026年6月1日08上线仅72小时被强制下架:Claude Fable 5 的短命09Claude Code、Codex、Cursor三分天下:2026年AI编程Agent生态全景剖析10《置身钉内》原文-可播放阅读