vue使用Sass时报错问题的解决方法


Posted in Javascript onOctober 14, 2020

sass:
安装:

npm config set registry https://registry.npm.taobao.org/

//sass-node报错的话,使用镜像源cnpm install node-sass sass-loader --save-dev 再安装一次
npm install node-sass --registry=https://registry.npm.taobao.org

package.json中更改sass-loader版本

"sass-loader": "^7.3.1",

使用:
页面中直接使用或者@代替src(3.x中@无需配置,2.x中需要在webpack文件中配置)
vue使用Sass时报错问题的解决方法

问题描述:
下面这个问题是我使用sass时碰见的报错:

*!!vue-style-loader!css-loader?{“sourceMap”:true}!
../../../../vue-loader/lib/style-compiler/index?{“vue”:t
rue,”id”:”data-v-570115ee”,”scoped”:false,”hasInlineConfig”:false}!../../../../vux-loader/src/after-less-loader.js!less-loader?{“so
urceMap”:true}!../../../../vux-loader/src/style-loader.js!../../../../vue-loader/lib/selector?type=style
s&index=0!./index.vue in ./node_m
odules/vux/src/components/alert
/index.vue

解决方案
此类问题一般是缺少相关依赖而导致的,对于本例,仔细看一下报错提示信息,抓住关键词,vue-style-loader!css-loader,说明是css解析的时候出了问题。
所以,解决方案就要根据情况而定,看你使用的CSS语言是什么,是常规的 或者 less 或者 sass。

1.如果 常规 中碰到,执行

npm install stylus-loader css-loader style-loader --save-dev

2.如果 less中碰到,执行

npm install less less-loader --save-dev

3.如果 sass 中碰到,执行

npm install sass sass-loader --save-dev

安装依赖就行
或者

$npm intall sass-loader --save ; $npm install node-sass --save

如果你不知道,好吧,你三个都执行吧?

一般只有在初始化配置的的时候才会出现这个问题,如果是已经完好的项目都会在package.json中已经配好,直接install即可。

到此这篇关于vue使用Sass时报错问题的解决方法的文章就介绍到这了,更多相关vue使用Sass报错内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
云网广告中的代码,提示出错,大家找找
Nov 21 Javascript
ExtJs 表单提交登陆实现代码
Aug 19 Javascript
javascript等号运算符使用详解
Apr 16 Javascript
JS实现网页上随滚动条滚动的层效果代码
Nov 04 Javascript
详解用原生JavaScript实现jQuery的某些简单功能
Dec 19 Javascript
微信小程序 flex实现导航实例详解
Apr 26 Javascript
js使用highlight.js高亮你的代码
Aug 18 Javascript
jQuery实现动态加载select下拉列表项功能示例
May 31 jQuery
AngularJS修改model值时,显示内容不变的实例
Sep 13 Javascript
在 Angular-cli 中使用 simple-mock 实现前端开发 API Mock 接口数据模拟功能的方法
Nov 28 Javascript
JS中数据结构之栈
Jan 01 Javascript
vue-cli3 取消eslint校验代码的解决办法
Jan 16 Javascript
JavaScript原生数组函数实例汇总
Oct 14 #Javascript
如何通过JS实现日历简单算法
Oct 14 #Javascript
浅谈js数组splice删除某个元素爬坑
Oct 14 #Javascript
如何使用JS console.log()技巧提高工作效率
Oct 14 #Javascript
JavaScript Blob对象原理及用法详解
Oct 14 #Javascript
基于javascript原生判断DOM是否加载完毕
Oct 14 #Javascript
JavaScript常用进制转换及位运算实例解析
Oct 14 #Javascript
You might like
在apache下限制每个虚拟主机的并发数!!!!
2006/10/09 PHP
PHP及Zend Engine的线程安全模型分析
2011/11/10 PHP
使用PHP实现阻止用户上传成人照片或者裸照
2014/12/25 PHP
CodeIgniter控制器之业务逻辑实例分析
2016/01/20 PHP
高质量PHP代码的50个实用技巧必备(下)
2016/01/22 PHP
Laravel5.1 框架表单验证操作实例详解
2020/01/07 PHP
javascript新手语法小结
2008/06/15 Javascript
javascript 同时在IE和FireFox获取KeyCode的代码
2010/02/07 Javascript
connect中间件session、cookie的使用方法分享
2014/06/17 Javascript
JavaScript按值删除数组元素的方法
2015/04/24 Javascript
js实现表单Radio切换效果的方法
2015/08/17 Javascript
jQuery实现图片上传和裁剪插件Croppie
2015/11/29 Javascript
jquery遍历函数siblings()用法实例
2015/12/24 Javascript
有关JavaScript中call()和apply() 的一些理解
2016/05/20 Javascript
JS实现的图片预览插件与用法示例【不上传图片】
2016/11/25 Javascript
javascript checkbox/radio onchange不能兼容ie8处理办法
2017/06/13 Javascript
Node.js log4js日志管理详解
2018/07/31 Javascript
JS加密插件CryptoJS实现AES加密操作示例
2018/08/16 Javascript
利用jqgrid实现上移下移单元格功能
2018/11/07 Javascript
jQuery中DOM操作原则实例分析
2019/08/01 jQuery
小程序如何获取多个formId实现详解
2019/09/20 Javascript
浅析Python中yield关键词的作用与用法
2016/11/29 Python
Pandas中把dataframe转成array的方法
2018/04/13 Python
对python numpy数组中冒号的使用方法详解
2018/04/17 Python
jupyter notebook 中输出pyecharts图实例
2020/04/23 Python
python多线程并发实例及其优化
2019/06/27 Python
python的debug实用工具 pdb详解
2019/07/12 Python
JD Sports比利时官网:英国领先的运动鞋和运动服饰零售商
2018/10/10 全球购物
学生党员思想汇报范文
2014/01/09 职场文书
简短大学毕业感言
2014/01/18 职场文书
函授自我鉴定范文
2014/02/06 职场文书
《七颗钻石》教学反思
2014/02/28 职场文书
文秘班元旦晚会活动策划方案
2014/08/28 职场文书
开展党的群众路线教育实践活动工作总结
2014/11/05 职场文书
2015年文秘个人工作总结
2015/10/14 职场文书
详细了解MVC+proxy
2021/07/09 Java/Android