解决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 相关文章推荐
ext读取两种结构的xml的代码
Nov 05 Javascript
基于jQuery的淡入淡出可自动切换的幻灯插件
Aug 24 Javascript
jQuery实用基础超详细介绍
Apr 11 Javascript
javascript跨域的4种方法和原理详解
Apr 08 Javascript
JS定时器使用,定时定点,固定时刻,循环执行详解
May 31 Javascript
JavaScript 事件对内存和性能的影响
Jan 22 Javascript
js随机生成一个验证码
Jun 01 Javascript
Angular.js前台传list数组由后台spring MVC接收数组示例代码
Jul 31 Javascript
Angular使用Md5加密的解决方法
Sep 16 Javascript
基于vue组件实现猜数字游戏
May 28 Javascript
详解基于mpvue的小程序markdown适配解决方案
May 08 Javascript
JS实现键值对遍历json数组功能示例
May 30 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
其他功能
2006/10/09 PHP
PHP图片上传类带图片显示
2006/11/25 PHP
php环境配置 php5 MySQL5 apache2 phpmyadmin安装与配置图文教程
2007/03/16 PHP
php 缩略图实现函数代码
2011/06/23 PHP
tp5框架的增删改查操作示例
2019/10/31 PHP
修改发贴的编辑功能
2007/03/07 Javascript
js no-repeat写法 背景不重复
2009/03/18 Javascript
javascript parseInt 大改造
2009/09/27 Javascript
js 多种变量定义(对象直接量,数组直接量和函数直接量)
2010/05/24 Javascript
《JavaScript高级程序设计》阅读笔记(二) ECMAScript中的原始类型
2012/02/27 Javascript
javascript简单实现命名空间效果
2014/03/06 Javascript
使用jquery菜单插件HoverTree仿京东无限级菜单
2014/12/18 Javascript
Node.js开源应用框架HapiJS介绍
2015/01/14 Javascript
JavaScript控制网页平滑滚动到指定元素位置的方法
2015/04/17 Javascript
使用AngularJS创建单页应用的编程指引
2015/06/19 Javascript
javascript中的Function.prototye.bind
2015/06/25 Javascript
关于原生js中bind函数的简单实现
2016/08/10 Javascript
微信小程序 数组(增,删,改,查)等操作实例详解
2017/01/05 Javascript
微信小程序 slider 详解及实例代码
2017/01/10 Javascript
JavaScript实现左右下拉框动态增删示例
2017/03/09 Javascript
微信小程序实现动态设置页面标题的方法【附源码下载】
2017/11/29 Javascript
vue实现打印功能的两种方法
2018/09/07 Javascript
JavaScript实现新年倒计时效果
2018/11/17 Javascript
简单了解JavaScript中常见的反模式
2019/06/21 Javascript
微信小程序自定义波浪组件使用方法详解
2019/09/21 Javascript
构建Vue大型应用的10个最佳实践(小结)
2019/11/07 Javascript
解决echarts中横坐标值显示不全(自动隐藏)问题
2020/07/20 Javascript
python使用pandas实现数据分割实例代码
2018/01/25 Python
jupyter notebook 的工作空间设置操作
2020/04/20 Python
彻底弄明白CSS3的Media Queries(跨平台设计)
2010/07/27 HTML / CSS
联想马亚西亚官方网站:Lenovo Malaysia
2018/09/19 全球购物
民族团结先进个人事迹材料
2014/06/02 职场文书
实训报告范文大全
2014/11/04 职场文书
2015年乡镇纪检工作总结
2015/04/22 职场文书
2016年八一建军节活动总结
2016/04/05 职场文书
Python中itertools库的四个函数介绍
2022/04/06 Python