vue 使用scss 依赖报错

最新推荐文章于 2023-03-29 14:12:20 发布
最新推荐文章于 2023-03-29 14:12:20 发布
阅读量404 收藏
点赞数
文章标签： vue css node.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_37237495/article/details/113841983
版权
在Vue项目中遇到SCSS样式依赖错误，错误信息表明需在`package.json`的`devDependencies`中添加相关依赖。解决方案是手动在该目录下添加缺失的SCSS依赖项，然后运行`npm install`安装新添加的依赖，以确保项目能够正常编译SCSS文件。
摘要由CSDN通过智能技术生成

在vue 项目中使用 scss 样式时，

<style lang="scss" scoped>
	 ........
</style>

报依赖错误，错误信息如下：
在这里插入图片描述
请在
package.json
devDependencies
目录下添加依赖：

"node-sass": "^4.9.0"
最低0.47元/天 解锁文章
丿Mr_Liu
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue项目中使用scss的方法步骤
10-16
主要介绍了vue项目中使用scss的方法步骤，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
Sass简单使用
weixin_33957648的博客
12-16 506
Sass是成熟、稳定、强大的CSS预处理器，而SCSS是Sass3版本当中引入的新语法特性，完全兼容CSS3的同时继承了Sass强大的动态功能。 特性概览 CSS书写代码规模较大的Web应用时，容易造成选择器、层叠的复杂度过高，因此推荐通过SASS预处理器进行CSS的开发，SASS提供的变量、嵌套、混合、继承等特性，让CSS的书写更加有趣与程式化。 变量 变量用来存储需要在CSS中...
在vue中使用scss
u013105398的专栏
04-20 663
当我们在.vue文件的样式中加入再执行npm run dev时会出现如下错误： 原因是因为缺少依赖。但是当操作npm install node-sass sass-loader vue-css-loader 依旧出错， 网上查找资料说是翻墙原因，因此改用淘宝镜像安装： 最后便可成功运行。
在Vue中使用scss
ruarua的博客
11-12 1054
在vue中使用scss
vue中使用scss
田兴的博客
01-07 625
1、安装 npm install node-sass --save-dev npm install sass-loader --save-dev 2、配置 在build中的 webpack.base.conf.js 文件中，找到rules，添加 // 在 rules中添加 { test: /\.scss$/, loaders: ['style', 'css', 'sass'] } 3...
vue cli3.0 引入eslint 结合vscode使用
10-16
本文主要介绍如何在使用Vue CLI 3.0创建的Vue项目中引入ESLint代码检测工具，并结合Visual Studio Code（VSCode）编辑器来实现代码的实时检测与自动修复。 ### 知识点一：ESLint简介 ESLint是一款插件化的...
在Vue中使用Compass的方法
11-26
以下是在Vue项目中使用Compass的详细步骤： 首先，我们需要创建一个新的Vue项目。你可以使用Vue的官方CLI工具`vue-cli`来快速搭建项目结构。在命令行中输入以下命令： ```bash vue init webpack compass-demo ``` ...
vue使用Sass时报错问题的解决方法
10-14
然而，在实际开发过程中，可能会遇到Vue使用Sass时的报错问题。本篇文章将详细解析这类问题的原因并提供相应的解决策略。 首先，确保正确安装了Sass的相关依赖。在npm环境下，可以使用以下命令安装`node-sass`和`...
vue-modules
03-21
本篇文章将深入探讨 Vue 模块的构建过程，以及与之相关的 JavaScript 组件、Vue 及 SCSS 知识点。 首先，让我们安装必要的依赖。在项目根目录下，执行以下命令： ```bash $ npm install ``` 这将根据 `package....
vue项目中使用scss
weixin_45665171的博客
03-29 1万+
vue项目中安装、引入、使用scss
sass相关依赖包，方便不便于下载sass的同学
05-04
sass相关依赖包，下载之后，直接放在node_modules中即可使用，主要为了解决sass依赖包下载失败的问题
在VUE项目中使用SCSS，从安装步骤到语法说明，带你快速入门！！
jingjing的博客
09-08 1811
最近在做VUE项目时用到了SCSS ，在这里总结一下SCSS在项目中是如何使用的。 首先要了解什么是SCSS？ SCSS是一种CSS预处理语言，定义了一种新的专门的编程语言，编译后形成正常的css文件，为css增加一些编程特性，无需考虑浏览器的兼容性（完全兼容css3），让css更加简洁、适应性更强，可读性更佳，更易于代码的维护等诸多好处。CSS预处理语言有SCSS (SASS) 和LESS、POSTCSS。 SCSS和SASS 有什么区别？ sass是以严格缩进语法规则来编写代码的，不包括大括号和分号，
vue——项目中使用scss
一只程序喵
07-06 417
1. 使用vue-cli创建新项目：vue init webpack my-project 2. 安装sass 依赖包 ，在cmd界面输入： // 命令行 npm install sass-loader --save-dev npm install node-sass --sava-dev 3. 在build文件夹（使用vue-cli才有有效webpack.base.conf.js文件夹）下的webpack.base.conf.js的rules里面添加配置 module: { rules: [
vue中scss用法
qq_41797053的博客
09-06 6441
我们这里用两个部分来说明吧。1.如何学习Scss2.如何使用Scss1.如何学习Scss学习Scss的第一步不是你要知道什么是Scss的概念啊什么的，而是找到一个合适的资源从头开始学习，我在这里推荐慕课网的资源Sass入门篇，还有Sass进阶篇，sass中文官网大家学习完以后，基本上就什么会了。这里我整理一下它的一些重要的概念。基本上如果你知道这些，基本的使用就可...
vue中如何使用scss
qq_42957741的博客
07-22 366
第一步，创建vue项目，vue init webpack myvue 第二步，安装scss，项目运行cmd中输入 npm install sass-loader --save-dev npm install node-sass --sava-dev 第三步，在build文件夹下的webpack.base.conf.js的rules里面添加配置 { test: /\.scss$/, loader...
如何在VUE项目中使用SCSS
weixin_30565199的博客
01-07 987
首先要了解什么是CSS 预处理器？ SCSS是一种CSS预处理语言 定义了一种新的专门的编程语言，编译后形成正常的css文件，为css增加一些编程特性，无需考虑浏览器的兼容性（完全兼容css3），让css更加简洁、适应性更强，可读性更佳，更易于代码的维护等诸多好处。CSS预处理语言有SCSS(SASS) 和LESS、POSTCSS 那么SCSS和SASS 有什么区别呢 · 文件扩...
vue项目中引入 scss
蓝胖子的博客
02-15 2621
①安装sass 依赖包 ，在cmd界面输入： npm install sass-loader --save-dev npm install node-sass --sava-dev 1.1下载指定版本 npm i -D sass-loader@7.1.0 npm install node-sass --sava-dev ② 在build文件夹下的webpack.base.conf.js的rules里面添加配置 { test: / \.scss$ /, loade
解决vue中使用scss时，依赖node-sass和sass-loader的版本问题：
热门推荐
糖果墙的博客
11-18 2万+
解决vue中使用scss时，依赖node-sass和sass-loader的版本问题：前言1、问题引入2、问题解决3、总结： 前言   为什么同样的代码，同样的操作，在他电脑上就能运行出来，在我的电脑上就运行不出来？那有没有考虑版本问题呢！我在学Vue的过程中就被版本问题狠狠地折磨了一次。   下面我将针对这个node-sass和sass-loader的版本问题，提供一个较为可靠的解决思路，希望能帮助到将来碰到这个问题的朋友。 1、问题引入   我是一个vue新手，今天在学习vue的时候需要写样式，然后用的
vue 使用scss报错 this.getOptions is not a function
最新发布
04-28
这个错误通常是由于vue-loader版本过低导致的，可以尝试升级vue-loader的版本或者使用sass-loader代替scss-loader来解决问题。 如果你使用的是vue-cli 3.x，可以尝试执行以下命令升级vue-loader的版本： ``` npm update vue-loader ``` 如果你使用的是vue-cli 2.x，可以在build目录下的webpack.base.conf.js文件中将 ``` { test: /\.scss$/, loader: 'style!css!sass', } ``` 改为 ``` { test: /\.scss$/, loaders: ['style', 'css', 'sass'] } ``` 或者使用sass-loader代替scss-loader： ``` { test: /\.scss$/, loaders: ['style', 'css', 'sass'] } ``` 如果以上方法都不能解决问题，可以尝试查看其他依赖包的版本是否有冲突，或者重新安装依赖包。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值