解决 vite.config.ts 引入scss 预处理报错

版本号:

bash 复制代码
"sass": "^1.86.3",

"sass-loader": "^16.0.5",

"vite": "^6.2.0"

报错1:plugin:vite:css SASS Error:Can't find stylesheet to import

vite.config.ts 开始文件错误

修改之后:完美解决报错(不过我还没搞懂为什么一定要使用src别名???)

注意⚠️:新版引入需要使用@use

在 Sass 中,@use 规则用于加载另一个样式表,并将其内容作为模块导入。

与 @import 不同,@use 规则会创建一个命名空间,以避免变量、函数和混合宏的命名冲突。

报错2: plugin:vite:css sass Error: Undefined variable

明明正确配置,也正确使用了,还是报错变量未定义

开始APP.vue文件如下:

**解决:**修改APP.vue文件之后如下:

不可能我的每一个全局变量都要使用这个variable.前缀吧?可以如下继续更改

每一个引入scss文件的位置都要加一个 as *

**as ***的作用是将导入的模块内容直接暴露在当前样式表的命名空间中,这样你就可以像使用 @import 一样直接使用导入的变量、函数和混合宏。

更改后的文件代码如下

坚持就是胜利✌️!

相关推荐
qq_364682153 分钟前
录音APP怎么切换语言?多语言版本如何使用
java·服务器·前端
志尊宝15 分钟前
AI原生前端开发(037):AI辅助的Vue 3开发最佳实践
前端·vue.js·ai-native
中科三方20 分钟前
AI时代新攻击面:悬空DNS记录正在成为黑客的低成本入侵入口
服务器·前端·人工智能
努力变的更好1 小时前
H5与小程序之间的回调
前端·小程序·apache
汤米粥1 小时前
目前流行的前端 CSS 框架
前端·css·bootstrap·ant design·‌tailwind css·bulma
砚凝霜1 小时前
CTF Misc 签到 GXUST·CTF:查看源码 + HTML 注释 + Base64 解码(附 Base64 原理)
前端·html
徐小夕1 小时前
扒了JitWord的源码,我终于搞懂了企业级在线Word到底有多难写
前端·vue.js·github
lily5227831 小时前
工具池与分发
前端·chrome
徐小夕@趣谈前端2 小时前
老旧Word格式全支持!JitWord协同AI文档4.1,让Word文档无缝迁移到Web端
前端·人工智能·word
螺丝钉tina2 小时前
[Playwright][01] 从 Puppeteer 到 Playwright:为什么选择 Playwright + TypeScript?
前端·javascript·typescript