解决 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 一样直接使用导入的变量、函数和混合宏。

更改后的文件代码如下

坚持就是胜利✌️!

相关推荐
为什么不问问神奇的海螺呢丶19 分钟前
n9e categraf redis监控配置
前端·redis·bootstrap
云飞云共享云桌面20 分钟前
推荐一些适合10个SolidWorks设计共享算力的服务器硬件配置
运维·服务器·前端·数据库·人工智能
刘联其1 小时前
.net也可以用Electron开发跨平台的桌面程序了
前端·javascript·electron
韩曙亮1 小时前
【jQuery】jQuery 选择器 ④ ( jQuery 筛选方法 | 方法分类场景 - 向下找后代、向上找祖先、同级找兄弟、范围限定查找 )
前端·javascript·jquery·jquery筛选方法
前端 贾公子1 小时前
Node.js 如何处理 ES6 模块
前端·node.js·es6
pas1361 小时前
42-mini-vue 实现 transform 功能
前端·javascript·vue.js
esmap1 小时前
OpenClaw与ESMAP AOA定位系统融合技术分析
前端·人工智能·计算机视觉·3d·ai·js
毕设源码-钟学长2 小时前
【开题答辩全过程】以 基于node.js vue的点餐系统的设计与实现为例,包含答辩的问题和答案
前端·vue.js·node.js
小白路过2 小时前
记录vue-cli-service serve启动本地服务卡住问题
前端·javascript·vue.js
We་ct2 小时前
LeetCode 1. 两数之和:两种高效解法(双指针 + Map)
前端·算法·leetcode·typescript·哈希算法