【sass】vue里安装sass依赖

已于 2022-08-05 15:43:58 修改
阅读量558 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： vue/js 文章标签： vue.js sass 前端
于 2022-08-02 17:17:44 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/heye0815/article/details/126125756
本文介绍了如何在项目中安装和使用Sass和sass-loader。首先，通过npm安装这两个依赖，避免安装已被弃用的node-sass。安装完成后，可以在Vue项目的样式标签中直接使用SCSS语法。对于node-sass的兼容性问题，建议在Node.js v12.18.4版本下使用node-sass:^7.0.1和sass-loader:^7.0.0这两个特定版本。

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

sass的官网文档地址如下：

Sass: 安装 Sass | Sass 中文网 (sasscss.com)

sass-loader的文档地址如下：

sass-loader | webpack 中文网 (webpackjs.com)

首先用npm安装两个依赖：

npm install sass
npm install sass-loader

不需要安装node-sass 高版本的node已经弃用了，安装会报错

安装完成后就可以使用：

<style scoped lang="scss">

</style>

或者记录一个node-sass可以兼容的版本

Node.js   v12.18.4

"node-sass": "^7.0.1",

"sass-loader": "^7.0.0",

小白学习Vue3之管理系统模板搭建（三）——node-sass安装及登录页面
weixin_48160914的博客
04-29 1073
node-sass安装
vue2.0安装sass
caoluotuo的博客
05-20 1308
安装sass步骤: 1. npm install sass-loader@7.3.1 node-sass@4.13.1 -D 或者 npm install sass-loader@7.3.1 node-sass@4.12.0 -D 2.需要在build文件夹下的webpack.base.conf.js的rules里面添加配置 { test: /\.scss$/, loaders: ['style', 'css', 'sass'] } 3.使用SCSS时，在style样式标签中添加
sass相关依赖包，方便不便于下载sass的同学
05-04
sass相关依赖包，下载之后，直接放在node_modules中即可使用，主要为了解决sass依赖包下载失败的问题
Vue对sass的依赖
bujiongdan的博客
08-08 1918
Vue对sass的依赖 ①、首先安装依赖 $ npm install node-sass --save-dev $ npm install sass-loader --save-dev ②、在需要用到scss的地方标注： &lt;style lang="scss"&gt; &lt;/style&gt;   整体项目目录 --build --config --dist...
vue中使用sass
大湿胸的博客
05-02 327
1.npm install node-sass --save-dev2.npm install sass-loader --save-dev3.webpack.base.config.js的rules中配置{   test:/\.scss$/,    loaders:["style","css","sass"]}4.&lt;style lang="scss"&gt;&lt;/style&gt;..
Vue项目引进sass
qq_45997679的博客
08-31 1332
sass-loader依赖于node-sass,所以要安装node-sass cnpm install node-sass --save-dev //安装node-sass cnpm install sass-loader --save-dev //安装依赖包sass-loader cnpm install style-loader --save-dev //安装style-loader 2. 在build文件夹下的webpack.base.conf.js的m.
Vue项目中 安装及使用Sass（scss）
蓝胖子的博客
04-03 9446
Vue项目中 安装及使用Sass（scss）
详解在vue-cli项目中安装node-sass
12-01
1，使用save会在package.json中自动添加。 npm install node-sass --save npm install sass-loader --save 2，通常使用npm安装会出现以下报错，安装...cnpm install node-sass --save （使用淘宝镜像安装node-sass）
vue安装和使用scss及sass与scss的区别详解
12-10
1. 安装依赖：npm install node-sass sass-loader -D 2. webpack.base.conf.js文件 module: { { //手动添加这一条，相当于是编译识别sass! test: /\.scss$/, loaders: ["style", "css", "sass"]} } 3. 在.vue文件...
vue-cli如何添加less 以及sass
12-01
vue-cli中已经内置配置好了sass 以及lass的配置。如果需要的话直接下载两个模块就可以了 npm install node-sass --save-dev npm install sass-loader --save-dev 如果是淘宝镜像直接运行cnpm是一样的效果 然后在...
安装sass依赖
WHQNever_Stop的博客
07-21 613
安装sass依赖
安装sass/scss 依赖包
JasonJust博客站
06-27 579
安装sass/scss 依赖包
less、sass依赖安装
NIKCFNIF_66666的博客
08-09 294
less以及sass依赖安装，指定版本 避免版本过高报错问题
Vue使用sass的配置 - 戴向天
戴向天的博客
08-23 1138
大家好！我叫戴向天 QQ群：602504799 如若有不理解的，可加QQ群进行咨询了解 sass-loader依赖于node-sass,所以要安装node-sass npm install node-sass --save-dev //安装node-sass npm install sass-loader --save-dev //安装依赖包sass-loader npm install style-loader --save-dev //安装style-loa
【sass】sass、sass-loader依赖包下载、卸载
weixin_46368797的博客
08-03 2488
sass、sass-loader下载
vue项目如何使用.scss文件以及安装依赖遇到的各种问题
小猫爪子
05-13 854
只有使用类似这样的指令，依赖包在package.json中才会有记录，别人在clone这个项目之后，cnpm install才可以下载到所有的依赖包。
使用vue-manage-system找不到sass依赖的
u014477038的专栏
10-25 659
今天使用vue-manage-system开发后台管理系统界面，由于平时都是使用sass，就在系统里面添加了sass-loader跟node-sass，谁编译的时候一直报错，报错如下： This dependency was not found 就是没找到vue-style-loader跟css-loader，自己手动安装还是不行，百度之，有相同的情况，但是使用的是less跟sty
项目安装依赖的时候sass的问题
weixin_44744795的博客
02-09 433
sass问题 2010 在家办公 家中电脑因为刚重装了系统 很多环境依赖要重新安装 装好了 nodejs 和git后 成功把项目拉下来 然后 npm i 的时候出现问题了 结果就是在npm run dev的时候会出现以下错误 我们知道npm 安装的下载源地址是国外 问题也就在这里 sass依赖下载不下来了 解决办法 首先我们改变npm下载源的地址 改为淘宝镜像 就...
css预处理器sass安装（浅谈sass系列一）
weixin_39975379的博客
03-06 789
概念：什么是预处理器 css预处理器就是将css这个语言变成像js一样有变量、有函数的一种工具，目的就是让代码更加灵活，更加DRY。 是不是突然发现这个预处理器还挺重要的，但是我们不能为了用预处理器而用预处理器。 预处理器的弊端：css的文件体积和复杂度不可控、调试难度增加、成本。 安装：安装sass 说明：为什么要使用sass呐，因为他是最成熟最好用滴。 普通安装 SASS是Ruby语言写的，但...
vue sass安装
最新发布
02-21
要在Vue CLI创建的项目里集成Sass支持，需通过命令行执行如下操作： ```bash npm install sass-loader node-sass --save-dev ``` 这条指令会下载并安装`sass-loader` 和 `node-sass`两个必要的开发依赖项到当前...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值