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 相关文章推荐
菜鸟javascript基础资料整理2
Dec 06 Javascript
poshytip 基于jquery的 插件 主要用于显示微博人的图像和鼠标提示等
Oct 12 Javascript
js截取小数点后几位的写法
Nov 14 Javascript
jQuery实现固定在网页顶部的菜单效果代码
Sep 02 Javascript
快速解决js动态改变dom元素属性后页面及时渲染的问题
Jul 06 Javascript
JavaScript中数组的22种方法必学(推荐)
Jul 20 Javascript
简单几步实现返回顶部效果
Dec 05 Javascript
javascript使用递归算法求两个数字组合功能示例
Jan 03 Javascript
运用jQuery写的验证表单(实例讲解)
Jul 06 jQuery
说说AngularJS中的$parse和$eval的用法
Sep 14 Javascript
javascript流程控制语句集合
Sep 18 Javascript
如何进行微信公众号开发的本地调试的方法
Jun 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
Protoss兵种对照表
2020/03/14 星际争霸
探讨:使用XMLSerialize 序列化与反序列化
2013/06/08 PHP
PHP CURL获取cookies模拟登录的方法
2013/11/04 PHP
探寻PHP脚本不报错的原因
2014/06/12 PHP
php实现Session存储到Redis
2015/11/11 PHP
PHP实现本地图片转base64格式并上传
2020/05/29 PHP
javascript的函数作用域
2014/11/12 Javascript
html的DOM中document对象anchors集合用法实例
2015/01/21 Javascript
使用jquery实现鼠标滑过弹出更多相关信息层附源码下载
2015/11/23 Javascript
学习JavaScript设计模式(策略模式)
2015/11/26 Javascript
JavaScript模版引擎的基本实现方法浅析
2016/02/15 Javascript
jQuery遍历json的方法(推荐)
2016/06/12 Javascript
仿Angular Bootstrap TimePicker创建分钟数-秒数的输入控件
2016/07/01 Javascript
angular-ui-sortable实现可拖拽排序列表
2016/12/28 Javascript
highcharts 在angular中的使用示例代码
2017/09/20 Javascript
使用mock.js随机数据和使用express输出json接口的实现方法
2018/01/07 Javascript
vuex的使用及持久化state的方式详解
2018/01/23 Javascript
JavaScript实现4位随机验证码的生成
2021/01/28 Javascript
[08:47]DOTA2每周TOP10 精彩击杀集锦vol.6
2014/06/25 DOTA
python 自动提交和抓取网页
2009/07/13 Python
linux系统使用python监测系统负载脚本分享
2014/01/15 Python
在Gnumeric下使用Python脚本操作表格的教程
2015/04/14 Python
基于Python如何使用AIML搭建聊天机器人
2016/01/27 Python
对pycharm 修改程序运行所需内存详解
2018/12/03 Python
python生成带有表格的图片实例
2019/02/03 Python
用python对oracle进行简单性能测试
2020/12/05 Python
python 进制转换 int、bin、oct、hex的原理
2021/01/13 Python
餐饮业创业计划书范文
2014/01/06 职场文书
网上书店创业计划书
2014/01/12 职场文书
《两个铁球同时着地》教学反思
2014/02/13 职场文书
班主任寄语2015
2015/02/26 职场文书
工作时间证明
2015/06/15 职场文书
2015暑期社会实践个人总结
2015/07/13 职场文书
pytorch 一行代码查看网络参数总量的实现
2021/05/12 Python
python单元测试之pytest的使用
2021/06/07 Python
用php如何解决大文件分片上传问题
2021/07/07 PHP