vue3在使用@import “./index.scss“报错

A-超

已于 2025-05-06 19:22:42 修改

阅读量744

点赞数 1

CC 4.0 BY-SA版权

文章标签： vue.js 前端 javascript

于 2025-05-06 19:21:35 首次发布

本文链接：https://blog.csdn.net/weixin_52663662/article/details/147745820

Deprecation Warning: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0.

More info and automated migrator: https://sass-lang.com/d/import

2 │ @import "./index.scss";

在 Sass 3.0.0.之后导入样式使用 “@use” ，不在使用 @import 如下：

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

A-超

关注关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

npm报错File to import not found or unreadable: @/assets/styles/global.scss.

邓邓子的博客

02-02

4727

1、问题执行npm run serve报错： File to import not found or unreadable: @/assets/styles/global.scss. 2、解决方法缺少sass-loader，执行以下命令安装： npm install sass-loader 如果继续报错： Syntax Error: TypeError: this.getOptions is not a function 是由于sass-loader版本过高造成的，执行以下命令卸载当前版本安装低版

renren-fast-vue无法运行相关问题解决办法n ./src/assets/scss/index.scss Module build failed: Error: ENOENT: no su

qq_41556455的博客

07-22

6073

in ./src/assets/scss/index.scss Module build failed: Error: ENOENT: no such file or directory, scandir ‘C:\Users\xyy’s\Desktop\renren-fast-vue\node_modules\node-sass\vendor’ at Object.fs.readdirSync (fs.js:861:3) at Object.getInstalledBinaries (C:\Users\xy

参与评论您还未登录，请先登录后发表或查看评论

Sass 的 @import 规则已经被废弃，并且将在 Dart Sass 3.0.0 中被移除。以下是完整的详细案例代码

04-14

1077

以下是关于 Sass 的@import。

vue3:scss引用

TS_144636的博客

11-20

1758

3. 全局引用，在 vite.config.ts 文件下做如下配置。4. 开始使用，全局引用之后就可以在所有页面使用了。2.在src目录下创建bem.scss文件。1. 首先需要在项目根目录下安装scss。

解决vue3-element-admin项目中Sass弃用警告的技术方案

gitblog_07614的博客

06-27

397

解决vue3-element-admin项目中Sass弃用警告的技术方案问题背景在使用vue3-element-admin项目进行开发时，许多开发者遇到了一个频繁出现的警告信息："Deprecation Warning: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0"。这个警告虽...

解决vue3引入scss全局变量预处理失败

qq_39422370的博客

05-30

831

允许你按模块的方式导入样式表，使得导入的内容（如变量、混合宏、函数等）默认是局部的，避免了与全局样式的冲突。它还允许你为导入的模块创建别名，从而避免了可能出现的命名冲突问题。在预处理报错问题后，当用$a引入全局变量，又会出现一个问题[sass] Error: Undefined variable.vite配置文件vite.config.ts在css预处理配置中采用@use来导入全局变量配置文件。的作用是将导入的模块内容直接暴露在当前样式表的命名空间中，就可以像使用。版本中引入@use，旨在替代之前的。

【前端开发】Vue中引入Sass、Scss

朝拜者

01-16

4667

本文介绍了Vue项目中SCSS样式文件的配置和使用方法，包括创建全局样式文件、布局样式类，以及在vue.config.js中的配置。重点分析了常见问题及解决方案：样式重复编译（使用@use替代@import）、变量未定义（检查导入顺序）、@use规则冲突（确保最先声明）、私有成员访问（移除前缀）、变量重定义（更名变量）以及第三方库变量重写问题（通过新建文件导入）。文章提供了详细的代码示例和配置建议，帮助开发者正确管理Vue项目中的SCSS样式。

Vue3中使用@作为引用根目录报错

qq_48354174的博客

09-03

777

对于使用 Vite 的项目，需要在vite.config.ts文件中配置路径别名。在 Vue 3 中使用 @ 作为引用根目录（通常是 src 目录）报错，通常是因为配置未正确设置或者配置未被项目正确识别。

vue3 uni-app DeprecationWarning: Use of deprecated folder mapping “./” in the “exports”

Nicker_的专栏

03-11

4237

uni-app vue3 新项目(是不是uni-app好像不重要)，报错如下: 11:32:40.864 (node:3508) [DEP0148] DeprecationWarning: Use of deprecated folder mapping "./" in the "exports" field module resolution of the package at D:\MyWork\HFHD\YL\medicalcare3\node_modules\vuex\package.json. 1

vue3版本升级出现的问题-CSS篇::v-deep usage as a combinator has been deprecated. Use :deep(＜inner-selector＞) in

简单Cere

08-25

798

原先用的深度选择器 deep 是已经被遗弃的写法，最好用新的写法来代替。问题报错： v-deep usage as a combinator has been deprecated. Use :deep()所以改成新的语法重新启动就不会报错了。

vue3,配置scss文件自动导入

yuyuyuyuyuyyuuyu的博客

06-17

905

【代码】vue3,配置scss文件自动导入。

Deprecation Warning: The selector “.el-form ＞＞＞

举案齐眉意难平

12-01

2091

解决的方式是全部替换 /deep/ 和 >>> 替换成::v-deep 如下图所示。

最新发布

07-26

根据用户的问题，用户在使用Vue单文件组件时，在scoped样式中使用`@use`引入SCSS文件报错，希望找到解决方法。结合引用[1]中的内容，项目配置了Vite，并且在vite.config.ts中配置了全局引入SCSS变量文件（variable...

启动前端程序一直报错@import "@/styles/variables.scss";@use "@/styles/variables.scss" as *;

04-02

好的，用户遇到了在使用Sass时，通过@import和@use引入样式文件时出现的报错问题，具体是找不到变量文件或者语法错误。我需要先分析可能的原因，然后一步步给出解决方案。首先，用户提到的是SCSS文件，所以需要...

PostCSS received undefined instead of CSS string at new Input (/Users/fanxiguo/project/offsite-curing-mpaas1/node_modules/_postcss@8.5.3@postcss/lib/input.js:28:13) at parse (/Users/fanxiguo/project/offsite-curing-mpaas1/node_modules/_postcss@8.5.3@postcss/lib/parse.js:8:15) at new LazyResult (/Users/fanxiguo/project/offsite-curing-mpaas1/node_modules/_postcss@8.5.3@postcss/lib/lazy-result.js:165:16) at Processor.process (/Users/fanxiguo/project/offsite-curing-mpaas1/node_modules/_postcss@8.5.3@postcss/lib/processor.js:53:14) at Object.loader (/Users/fanxiguo/project/offsite-curing-mpaas1/node_modules/_postcss-loader@6.2.1@postcss-loader/dist/index.js:97:30) @ ./src/components/y-uploader/index.scss 4:14-315 @ ./src/components/y-uploader/index.js 20:0-23 @ ./node_modules/_babel-loader@8.4.1@babel-loader/lib/index.js??clonedRuleSet-40.use[0]!./node_modules/_vue-loader@15.11.1@vue-loader/lib/index.js??vue-loader-options!./src/views/NewRecord.vue?vue&type=script&lang=js 39:40-74 @ ./src/views/NewRecord.vue?vue&type=script&lang=js 1:0-233 1:249-252 1:254-484 1:254-484 @ ./src/views/NewRecord.vue 2:0-60 3:0-55 3:0-55 11:2-8 @ ./src/router/curing/index.js 182:51-118 @ ./src/router/ sync index\.js$ ./curing/index.js @ ./src/router/index.js 28:19-60 @ ./src/main.js 22:37-56

03-18

首先，用户提供的堆栈信息显示错误发生在处理`./src/components/y-uploader/index.scss`文件时。这说明问题可能与这个特定的SCSS文件有关。用户使用的是PostCSS 8.5.3和postcss-loader 6.2.1，可能涉及Webpack配置。...

scss文件内引入其他scss文件报错

宁波阿成的博客

12-06

1093

scss文件内引入其他scss文件报错

vue安装依赖后sass大量警告报错

a329715712的博客

01-30

3358

vue sass 版本出现大量警告报错

第六章：Vue3开篇

m0_61927991的博客

08-27

2647

Vue3知识点

vue3的基本使用(超详细)

m0_64875238的博客

11-05

8703

Vue3 的全面特性的总结 + V2 和 V3 的区别（超详细）