vue-cli的项目 style lang="scss" 写 scss样式报错

最新推荐文章于 2025-07-07 15:38:25 发布

耿耿耿

最新推荐文章于 2025-07-07 15:38:25 发布

阅读量1.5w

点赞数 5

CC 4.0 BY-SA版权

分类专栏： vue项目文章标签： vue项目遇到的问题

本文链接：https://blog.youkuaiyun.com/qq_34841115/article/details/79880588

vue项目专栏收录该内容

3 篇文章

订阅专栏

本文介绍了解决Vue项目中SCSS加载问题的方法。主要通过安装必要的依赖包如node-sass、sass-loader等来实现，并指出vue-cli默认不包含scss-loader。安装这些依赖后，由于vue-cli会自动配置loader，因此无需额外配置webpack。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

报错代码：

解决方案:

安装以下依赖就可以了，vue-cli默认没有scss-loader,scss-loader又需要node-sass，只安装scss-loader是不行的。另外webpack就不需要配置了，因为vue-cli会帮你配置安装的loader

"node-sass": "^4.5.1",
    "sass-loader": "^6.0.3",
    "scss": "^0.2.4",
    "scss-loader": "^0.0.1",

npm install （上面几个包） --save
ok

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

耿耿耿

关注关注

5
点赞
踩
3

收藏

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

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

在vue-cli中安装scss

吴小花的博客

03-16

2723

1.步骤一：安装node-sass、sass-loader、style-loader cnpm install node-sass --save-dev cnpm install sass-loader --save-dev cnpm install style-loader --save-dev 步骤二：安装sass-resources-loade...

vue 中使用 scss,解决style 使用lang = ‘scss’ 报错

King Saj

03-20

3391

<style lang="scss" rel="stylesheet/scss" scoped> @import "../assets/style/theme"; @import "../assets/style/mixin"; </style>

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

style 使用lang = ‘scss’ 报错

weixin_33887443的博客

12-27

2283

<style lang="scss" rel="stylesheet/scss" scoped> .export-wrapper{ } </style> 这样写就可以了转载于:https://www.cnblogs.com/longsiyuan/p/10185392.html

vue-cli的项目中 style lang=“scss“ 会报错

weixin_39430223的博客

11-24

762

vue-cli的项目中 style lang="scss" 会报错

CSS预处理器SASS/SCSS详解

最新发布

qq_44741577的博客

07-07

706

SCSS简介与核心特性 SCSS（Sassy CSS）是CSS的预处理器，扩展了CSS功能，支持变量、嵌套、混合宏等特性，提升开发效率和代码复用性。它兼容CSS3，提供模块化开发支持，但需编译后才能使用，存在一定的学习成本。核心特性：变量：以$定义可复用值（如颜色、字体）。嵌套：反映HTML结构，简化代码。运算：支持数学计算。混合宏（Mixin）与继承：通过@mixin和@extend重用代码。高级功能：包括条件语句、循环（@for、@while、@each）和自定义函数。模块化：通过@imp

在vue-cili中使用scss在组件文件.vue中的style标签中输入属性lang=“scss“报错

zhangyubababa的博客

02-26

1610

Module build failed: Error: Missing binding E:\newsproject\node_modules_nod 一定能解决的办法：在配置文件包package.json中修改sass-loader的版本号为7.3.1 重新装依赖 cnpm i 更新当前目录的依赖包npm update 重启项目 npm start即可完美解决！过程中调试使用到的命令有1 ...

vue中使用style lang="scss"报错(配置sass

庭落

09-18

4812

cnpm install sass-loader@7.3.1 --save-dev cnpm install node-sass --save 然后在webpack.base.conf.js的module中添加相关配置： { test: /\.s[a|c]ss$/, loader: 'style!css!sass' }

style加了lang=‘scss‘后报错

Hanx_的博客

03-17

983

报这个错误：TypeError: this.getResolve is not a function。把 package.json里的sass-loader版本改成7.3.1后。npm run dev 就能成功运行不报错了。style加了lang='scss'后报错。是因为sass-loader的版本号太高了。再 npm install 重新安装依赖。

在 vue-cli v3.0 中使用 SCSS/SASS的方法

01-19

在项目中使用 SCSS/SASS 进行样式编写无疑会节省很多开发样式的时间。关于如何在 vue-cli v3.0 中使用 SCSS/SASS，这里提供三种方案。前提是在使用 vue-cli 生成项目时勾选了 CSS Pre-processors (CSS预处理器)，...

vue-cli2项目中使用scss

Hi_MrXiao的博客

05-21

1204

首先要搞清楚Sass和Scss的区别：实际上Sass和Scss是同一种东西，Scss是 Sass3 引入新的语法，它们都是css预处理器。：Sass 默认使用“.sass”作为文件扩展名，而 Scss 使用“.scss”作为扩展名。：Sass 最初是以严格的缩进式语法规则来书写，不带大括号和分号，这种方式使得代码更加简洁，但在某些情况下可能不如Scss直观易读；相比之下，Scss的语法允许使用大括号和分号，与常规的 css语法相似，这使得 Scss更容易被 css开发者接受和使用。

详解vue-cli 构建项目 vue-cli请求后台接口 vue-cli使用axios、sass、swiper

08-27

Vue CLI 是一个基于 Vue.js 的命令行工具，用于快速搭建 Vue 项目。它简化了项目的配置，提供了预设（preset）来快速初始化项目。在本文中，我们将详细讲解如何使用 Vue CLI 构建项目，以及如何在项目中使用 axios、...

vue中使用lang = “scss“报错

include_computer的博客

12-15

1027

① npm install sass-loader@7.3.1 --save-dev ② npm install node-sass --save 安装node-sass报错安装不了，使用淘宝镜像安装 cnpm install node-sass --save ③ npm install style-loader --save ④ 在build/webpack.base.config.js中添加： { test: /\.scss$/, loaders: ['style', 'css',

vue-cli的项目中 style lang="scss" 会报错

qq_36196059的博客

11-30

5384

如果在没有安装scss 依赖的时候，style写lang=“scss”,就会报下面的错误由于已经解决问题了，报错截图就没有截，用一行报错英文表达吧 This dependency was not found : ...............................................................然后就是一大串的报错了那么，解决的办法就是安装依赖sc...

vue中使用 lang=“scss“ 报错

l13501058595的博客

10-22

1475

vue 使用 lang=“scss” 报错在写VUE在线编辑器的时候，为了样式能够美观一些，在style中加入lang=“scss”，显示如下报错：这是因为当前sass-loader的版本太高，webpack编译时出现了错误，所以我们安装低版本的依次在项目中输入以下命令： npm install sass-loader@7.3.1 --save-dev npm install node-sass --save npm install style-loader --save 这样在使用lang="s

vue打包之后样式缺失问题处理

weixin_43262264的博客

10-04

7330

vue打包后，发现样式缺失，或者有些样式有，有些没有，可能是因为css加载顺序问题导致编译后覆盖，在main.js中，按照element，app，router的顺序写，这样加载的时候就不会覆盖了，大概如下 ... import Vue from 'vue' import ElementUI from 'element-ui' import 'element-ui/lib/theme-chalk/index.css'; Vue.use(ElementUI) import App from './App' im

vue文件使用lang="scss"报错问题

qq_42586895的博客

11-05

3412

vue文件使用lang="scss"报错问题新建项目.vue文件中使用scss写样式。按照网上教程安装集中依赖模块并且配置后出现以下报错： github网址: 个人博客这是因为我们安装的sass-loader版本过高，只要我们安装7.3.1版本的sass-loader问题就解决了。如果其他插件已安装：只需要再把7.3.1版本的安装一下就行了。具体方法为：输入以下命令： npm ins...

在vue项目中使用lang='scss'报错

Zxiuping的博客

11-18

2532

在vue项目中样式使用scss出现错误， This dependency was not found: * !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data...

vue -- style使用scss样式报错

weixin_30341745的博客

03-23

942

1、报错信息 2、解决方案（vue-li默认没有scss-loader,scss-loader）安装以下依赖 (1) npm install node-sass --save （2）npm install sass-loader --save (3)npm install scss --save (4)npm install scss...

vue中style lang="scss" scoped中的scoped