解决vue-cli使用组件报错
今天使用vue-cli,明明写的没错,都是vue-cli自动生成的,编译时怎嘛就会报错呢?
报错信息如下:
浏览器端报错:
Failed to compile. ./src/components/Hi1.vue Module not found:
Error: Can't resolve 'stylus-loader' in 'E:\desktop\vue-review\vuejs\vue-cli\vuecli\src\components' @ ./src/components/Hi1.vue 4:2-310 @ ./src/router/index.js @ ./src/main.js @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js
控制台报错:
These dependencies were not found:
* !!vue-style-loader!css-loader?{"sourceMap":true}!../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-3232a8d1","scoped":true,"hasInlineConfig":false}!stylus-loader?{"sourceMap":true}!../../node_modules/vue-loader/lib/selector?type=styles&index=0!./Hi2.vue in ./src/components/Hi2.vue
* !!vue-style-loader!css-loader?{"sourceMap":true}!../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-32249150","scoped":true,"hasInlineConfig":false}!stylus-loader?{"sourceMap":true}!../../node_modules/vue-loader/lib/selector?type=styles&index=0!./Hi1.vue in ./src/components/Hi1.vue
To install them, you can run: npm install --save !!vue-style-loader!css-loader?{"sourceMap":true}!../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-3232a8d1","scoped":true,"hasInlineConfig":false}!stylus-loader?{"sourceMap":true}!../../node_modules/vue-loader/lib/selector?type=styles&index=0!./Hi2.vue !!vue-style-loader!css-loader?{"sourceMap":true}!../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-32249150","scoped":true,"hasInlineConfig":false}!stylus-loader?{"sourceMap":true}!../../node_modules/vue-loader/lib/selector?type=styles&index=0!./Hi1.vue
原来vue-cli在初始化项目时在package.json中没有引入 stylus和stylus-loader,而我在写代码时有用vscode的自动提示功能,然后就导致了错误的代码出现,(其实也不算错误,但我还是这么叫它)
<style lang="stylus" scoped>
</style>
就因为代码提示自动生成的lang="stylus"
,巧了,vue-cli初始化就没这方面的包
只要在项目根目录下运行:npm install stylus stylus-loader --save-dev
,在停止vue-cli,重新npm run dev
一下就ok了(如果过改了package.json里的dev,可能不是这个命令运行vue-cli
)
有时候太图方便也不好,尤其是在不了解它时o(╥﹏╥)o
解决vue-cli使用组件报错的更多相关文章
- 01-路由跳转 安装less this.$router.replace(path) 解决vue/cli3.0语法报错问题
2==解决vue2.0里面控制台包的一些语法错误. https://www.jianshu.com/p/5e0a1541418b 在build==>webpack.base.conf.j下注释掉 ...
- 使用Angular cli创建组件报错: Unexpected token / in JSON at position....
之前为了熟悉流程一直都是手动创建组件,今天试着用cli创建组件,居然报错了,报错大致为: Unexpected token / in JSON at position.... ,并且错误指向了.ang ...
- vue中使用JSX报错,如何解决
Support for the experimental syntax 'jsx' isn't currently enabled (32:12): 30 | }, 31 | render() { & ...
- vue init webpack nameXXX 报错问题:
vue新建demo项目报错如下: M:\lhhVueTest>vue init webpack L21_VueProject vue-cli · Failed to download repo ...
- 安装skype for business server组件 报错“未满足先决条件”和安装KB2982006补丁提示“此更新不适用于你的计算机”
安装skype for business server组件 报错“未满足先决条件” 上网经查询发现是没有安装KB2982006-x64 更新补丁 去官网上找这个补丁,发现这个补丁要热更新啥的,还要写邮 ...
- 解决MyEclipse中的js报错的小方法
今天,下了个模版,但是导进去的时候发现js会报错.看了下其他都没有错误.而有一个js报错误,请原谅我有点红色强迫症,不能留一点红色 . 错误如下:Syntax error on token " ...
- [转]解决IIS下UTF-8文件报错乱码的问题
找了两天才找到解决办法…….晕晕晕...用第二种方法解决了. 网上找到的方法都没有写这一条 If objASPError.ASPDescription > "" Then 后 ...
- Eclipse和MyEclipse使用技巧--解决MyEclipse中的js报错的小方法
今天,下了个模版,但是导进去的时候发现js会报错.看了下其他都没有错误.而有一个js报错误,请原谅我有点红色强迫症,不能留一点红色 . 错误如下:Syntax error on token " ...
- 解决springMVC文件上传报错: The current request is not a multipart request
转自:https://blog.csdn.net/HaHa_Sir/article/details/79131607 解决springMVC文件上传报错: The current request is ...
- vue 表单校验报错 "Error: please transfer a valid prop path to form item!"
vue 表单校验报错 "Error: please transfer a valid prop path to form item!" 原因:prop的内容和rules中定义的名称 ...
随机推荐
- Nginx 配置访问本地目录
server { listen 8888; # 监听端口 server_name peer; # 服务名 charset utf-8; # 字符集,可处理中文乱码 location / { autoi ...
- edltplus使用正则表达式替换多余空行
24-7 <font style="font-weight:bold;">24-7</font><div class="tab_conten ...
- 搭建django项目连接mysql数据库环境
开通博客园这么久,即将写下第一篇博客,十分兴奋.首先了,庆祝自己写下了码农生涯博客园第一篇博客,其次了,庆祝自己经过了10个小时奋战,终于成功搭建django项目连接mysql数据库的环境.在此过程中 ...
- HDU_3853_概率dp
http://acm.hdu.edu.cn/showproblem.php?pid=3853 又因为总期望为子期望的加权和,加权因子为子期望的转移概率,所以得到:dp[ i ][ j ]= p1 * ...
- UVA1623 Enter The Dragon (贪心)
题意: m个坑,n天,起初每个坑都是满的,每天至多有一个坑会下雨,下雨就会满,满了再下就输出no. 在没有雨的时候可以安排龙来喝水,把坑喝空,可行的话输出龙喝水的方案 思路: 边读入边操作,set保存 ...
- 第3章 JDK并发包(二)
3.1.2 重入锁的好搭档:Condition条件 它和wait()和notify()方法的作用是大致相同的.但是wait()和notify()方法是和synchronized关键字合作使用的,而Co ...
- Net Core 中WebAPI有关 Session的设置,及获取
步骤一: 在Startup 文件中做相应的设置 ConfigureServices方法里添加 //ConfigureServices添加: services.AddSession(options =& ...
- Docker Compose 模板文件 V2
模板文件是使用Compose的核心,默认模板文件名称为docker-compose.yml ,格式为YAML格式. 目录结构 [root@localhost ~]# tree /opt/compose ...
- Ansible 学习目录
1. Ansible 安装 2. Ansible hosts 文件配置 3. Ansible 常用模块 4. Ansible playbook使用
- 浅析Internet上使用的安全协议
Internet上使用的安全协议 网络安全是分层实现的,从应用层安全到数据链路层安全. 一.运输层安全协议:安全套接字SSL 1.1.简介 SSL 是安全套接层 (Secure Socket Laye ...