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 相关文章推荐
JS解密入门 最终变量劫持
Jun 25 Javascript
ff chrome和ie下全局动态定位的异同及全局高度的取法
Jun 30 Javascript
javascript框架设计读书笔记之数组的扩展与修复
Dec 02 Javascript
js+html5实现canvas绘制镂空字体文本的方法
Jun 05 Javascript
非常棒的jQuery图片轮播效果
Apr 17 Javascript
关于JS中的方法是否加括号的问题
Jul 27 Javascript
JS调用某段SQL语句的方法
Oct 20 Javascript
利用js实现前后台传送Json的示例代码
Mar 29 Javascript
Angular5中调用第三方库及jQuery的添加的方法
Jun 07 jQuery
Javascript迭代、递推、穷举、递归常用算法实例讲解
Feb 01 Javascript
vue防止花括号{{}}闪烁v-text和v-html、v-cloak用法示例
Mar 13 Javascript
vue选项卡切换登录方式小案例
Sep 27 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
PHP实现深度优先搜索算法(DFS,Depth First Search)详解
2017/09/16 PHP
PHP实现的CURL非阻塞调用类
2018/07/26 PHP
微信支付之JSAPI公众号支付详解
2019/05/15 PHP
Javascript中eval函数的使用方法与示例
2007/04/09 Javascript
javascript contains和compareDocumentPosition 方法来确定是否HTML节点间的关系
2010/02/04 Javascript
JavaScript 10件让人费解的事情
2010/02/15 Javascript
Jquery 模板数据绑定插件的使用方法详解
2013/07/08 Javascript
jQuery中append()方法用法实例
2014/12/25 Javascript
js简单判断flash是否加载完成的方法
2016/06/21 Javascript
Javascript中关于Array.filter()的妙用详解
2016/12/04 Javascript
基于Bootstrap table组件实现多层表头的实例代码
2017/09/07 Javascript
Angular弹出模态框的两种方式
2017/10/19 Javascript
jq.ajax+php+mysql实现关键字模糊查询(示例讲解)
2018/01/02 Javascript
vue.js实现插入数值与表达式的方法分析
2018/07/06 Javascript
详解如何在vue项目中使用eslint+prettier格式化代码
2018/11/10 Javascript
JavaScript事件对象深入详解
2018/12/30 Javascript
使用Python编写一个在Linux下实现截图分享的脚本的教程
2015/04/24 Python
基于Python socket的端口扫描程序实例代码
2018/02/09 Python
Python cookbook(数据结构与算法)同时对数据做转换和换算处理操作示例
2018/03/23 Python
Window10+Python3.5安装opencv的教程推荐
2018/04/02 Python
完美解决Python 2.7不能正常使用pip install的问题
2018/06/12 Python
python 读写文件,按行修改文件的方法
2018/07/12 Python
用Python实现大文本文件切割的方法
2019/01/12 Python
Python生成MD5值的两种方法实例分析
2019/04/26 Python
ipython和python区别详解
2019/06/26 Python
Python算法的时间复杂度和空间复杂度(实例解析)
2019/11/19 Python
有750多个顶级品牌的瑞士时尚在线:ABOUT YOU
2017/01/04 全球购物
布里斯班女装时尚品牌:Adrift
2017/12/28 全球购物
国际贸易专业个人鉴定
2014/02/22 职场文书
委托公证书
2014/04/08 职场文书
夫妻分居协议书范本(有子女版)
2014/11/01 职场文书
2015年爱国卫生工作总结
2015/04/22 职场文书
党小组考察意见
2015/06/02 职场文书
Vue项目中如何封装axios(统一管理http请求)
2021/05/02 Vue.js
springboot集成flyway自动创表的详细配置
2021/06/26 Java/Android
Python数据处理的三个实用技巧分享
2022/04/01 Python