解决vue-cli创建项目的loader问题


Posted in Javascript onMarch 13, 2018

在使用vue-cli项目创建项目中,使用sass等预编译css语言时,不需要在config中配置,只需要在项目中安装相应loader即可。

例如:

1、在项目中使用sass

$ npm i node-sass -D
$ npm i sass-loader -D

2、当使用vuex时,即使安装vux和vux-loader,在项目中使用了vux的组件,项目就无法启动,报错如下:

These dependencies were not found:

* !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../../../vue-loader/lib/style-compiler/index?{"vue":true,"id":"da
ta-v-28d8bf8a","scoped":false,"hasInlineConfig":false}!../../../../vux-loader/src/after-less-loader.js!less-loader?{"sourceMap":false}!..
/../../../vux-loader/src/style-loader.js!../../../../vue-loader/lib/selector?type=styles&index=0!./index.vue in ./~/vux/src/components/ce
ll/index.vue
* !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../../../vue-loader/lib/style-compiler/index?{"vue":true,"id":"da
ta-v-76475f48","scoped":false,"hasInlineConfig":false}!../../../../vux-loader/src/after-less-loader.js!less-loader?{"sourceMap":false}!..
/../../../vux-loader/src/style-loader.js!../../../../vue-loader/lib/selector?type=styles&index=0!./index.vue in ./~/vux/src/components/gr
oup/index.vue

To install them, you can run: npm install --save !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../../../vue-loade
r/lib/style-compiler/index?{"vue":true,"id":"data-v-28d8bf8a","scoped":false,"hasInlineConfig":false}!../../../../vux-loader/src/after-le
ss-loader.js!less-loader?{"sourceMap":false}!../../../../vux-loader/src/style-loader.js!../../../../vue-loader/lib/selector?type=styles&i
ndex=0!./index.vue !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../../../vue-loader/lib/style-compiler/index?{"v
ue":true,"id":"data-v-76475f48","scoped":false,"hasInlineConfig":false}!../../../../vux-loader/src/after-less-loader.js!less-loader?{"sou
rceMap":false}!../../../../vux-loader/src/style-loader.js!../../../../vue-loader/lib/selector?type=styles&index=0!./index.vue
> Listening at http://localhost:8080

大概看一眼可以确定loader出了问题,但是我已经安装了sass编译的依赖,依然无法解决错误。

后来去vux的包中看了一下,组件中使用的是less,于是安装less依赖解决问题。

以上这篇解决vue-cli创建项目的loader问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
js常见表单应用技巧
Jan 09 Javascript
用showModalDialog弹出页面后,提交表单总是弹出一个新窗口
Jul 18 Javascript
firefox firebug中文入门教程 脚本之家新年特别版
Jan 02 Javascript
非阻塞动态加载javascript广告实现代码
Nov 17 Javascript
js遍历、动态的添加数据的小例子
Jun 22 Javascript
node.js中的fs.write方法使用说明
Dec 15 Javascript
js轮播图的插件化封装详解
Jul 17 Javascript
es6 symbol的实现方法示例
Apr 02 Javascript
基于JS实现数字动态变化显示效果附源码
Jul 18 Javascript
js实现简单的点名器随机色实例代码
Sep 20 Javascript
Vue包大小优化的实现(从1.72M到94K)
Feb 18 Vue.js
JavaScript实现筛选数组
Mar 02 Javascript
浅谈Vue-cli单文件组件引入less,sass,css样式的不同方法
Mar 13 #Javascript
基于vue.js实现的分页
Mar 13 #Javascript
微信小程序中实现手指缩放图片的示例代码
Mar 13 #Javascript
基于vue中css预加载使用sass的配置方式详解
Mar 13 #Javascript
Angular 4.x+Ionic3踩坑之Ionic3.x pop反向传值详解
Mar 13 #Javascript
vue加载自定义的js文件方法
Mar 13 #Javascript
vue轮播图插件vue-concise-slider的使用
Mar 13 #Javascript
You might like
《五等分的花嫁》漫画完结!2020年10月第2期TV动画制作组换血!
2020/03/06 日漫
一个多文件上传的例子(原创)
2006/10/09 PHP
php防攻击代码升级版
2010/12/29 PHP
php 日期和时间的处理-郑阿奇(续)
2011/07/04 PHP
php获取数据库结果集方法(推荐)
2017/06/01 PHP
js实现杯子倒水问题自动求解程序
2013/03/25 Javascript
js实现全屏漂浮广告移入光标停止移动
2013/12/02 Javascript
js精美的幻灯片画集特效代码分享
2015/08/29 Javascript
jquery通过name属性取值的简单实现方法
2016/06/20 Javascript
Vue实例简单方法介绍
2017/01/20 Javascript
JavaScript控制输入框中只能输入中文、数字和英文的方法【基于正则实现】
2017/03/03 Javascript
Vue动态实现评分效果
2017/05/24 Javascript
详解React-Native解决键盘遮挡问题(Keyboard遮挡问题)
2017/07/13 Javascript
JavaScript基于面向对象实现的猜拳游戏
2018/01/03 Javascript
Vue中对比scoped css和css module的区别
2018/05/17 Javascript
详解React+Koa实现服务端渲染(SSR)
2018/05/23 Javascript
vue 中 beforeRouteEnter 死循环的问题
2019/04/23 Javascript
通过vue手动封装on、emit、off的代码详解
2019/05/29 Javascript
JS实现导航栏楼层特效
2020/01/01 Javascript
使用Vue Composition API写出清晰、可扩展的表单实现
2020/06/10 Javascript
Python监控主机是否存活并以邮件报警
2015/09/22 Python
Python列表(List)知识点总结
2019/02/18 Python
Python 实现交换矩阵的行示例
2019/06/26 Python
在python中利用numpy求解多项式以及多项式拟合的方法
2019/07/03 Python
python 处理微信对账单数据的实例代码
2019/07/19 Python
Python3爬虫中Ajax的用法
2020/07/10 Python
详解查看Python解释器路径的两种方式
2020/10/15 Python
Python中对象的比较操作==和is区别详析
2021/02/12 Python
详解css3 object-fit属性
2018/07/27 HTML / CSS
英国领先的酒杯和水晶玻璃器皿制造商:Dartington Crystal
2019/06/23 全球购物
新春联欢会主持词
2014/03/24 职场文书
师范生免费教育协议书范本
2014/10/09 职场文书
催款函怎么写
2015/06/24 职场文书
《打电话》教学反思
2016/02/22 职场文书
vue3如何优雅的实现移动端登录注册模块
2021/03/29 Vue.js
Nginx如何配置Http、Https、WS、WSS的方法步骤
2021/05/11 Servers