热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

(转)Vue2.0入门实例注意事项

https:www.cnblogs.comliyujun1988p7078235.htmlVue2.0入门实例注意事项由于vue2.0导致其他相关编译打

https://www.cnblogs.com/liyujun1988/p/7078235.html

Vue2.0入门实例注意事项
 

由于 vue2.0 导致其他相关编译打包工具没更新导致

解决办法: 请运行以下命令

1
npm update -g

报错

1
2
3
4
5
6
7
8
Error: Cannot find module  'opn'
Error: Cannot find module  'webpack-dev-middleware'
Error: Cannot find module  'express'
Error: Cannot find module  'compression'
Error: Cannot find module  'sockjs'
Error: Cannot find module  'spdy'
Error: Cannot find module  'http-proxy-middleware'
Error: Cannot find module  'serve-index'

如果你用的是老版本的 vue-cli 还可能报其他错误,需要更新一下 vue-cli

1
npm update vue-cli

安装一下这个依赖到工程开发环境

1
2
3
4
5
6
7
8
9
cnpm install opn --save-dev
cnpm install webpack-dev-middleware --save-dev
cnpm install express --save-dev
cnpm install compression --save-dev
cnpm install sockjs --save-dev
cnpm install spdy --save-dev
cnpm install http-proxy-middleware --save-dev
cnpm install serve-index --save-dev
cnpm install connect-history-api-fallback --save-dev

再启动项目,报错

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
ERROR  in  ./src/main.js
Module build failed: Error: Cannot find module  'babel-runtime/helpers/typeof'
at Function.Module._resolveFilename (module.js:440:15)
at Function.Module._load (module.js:388:25)
at Module.require (module.js:468:17)
at require ( internal /module.js:20:19)
at Object. (/Volumes/MacStorage/Coding/Web/vue-test/node_modules/.6.17.0@babel-core/lib/transformation/file/index.js:6:16)
at Module._compile (module.js:541:32)
at Object.Module._extensions..js (module.js:550:10)
at Module.load (module.js:458:32)
at tryModuleLoad (module.js:417:12)
at Function.Module._load (module.js:409:3)
@ multi main
ERROR  in  ./~/.2.1.0-beta.8@webpack-dev-server/client/socket.js
Module not found: Error: Can 't resolve ' sockjs-client ' in ' /Volumes/MacStorage/Coding/Web/vue-test/node_modules/.2.1.0-beta.8@webpack-dev-server/client'
@ ./~/.2.1.0-beta.8@webpack-dev-server/client/socket.js 1:13-37
@ ./~/.2.1.0-beta.8@webpack-dev-server/client?http: //localhost:8080
@ multi main

安装一下 babel-runtime

1
cnpm install babel-helpers --save-dev

启动项目,再次报错

1
2
3
4
5
6
Module build failed: Error: Cannot find module  'babel-helpers'
Module build failed: Error: Cannot find module  'babel-traverse'
Module build failed: Error: Cannot find module  'json5'
Module build failed: Error: Cannot find module  'babel-generator'
Module build failed: Error: Cannot find module  'detect-indent'
Module build failed: Error: Cannot find module  'jsesc'

找不到依赖那就再安装一下

1
2
3
cnpm install babel-helpers --save-dev
cnpm install babel-traverse --save-dev
cnpm install json5 --save-dev

遇到

1
Module build failed: Error: Cannot find module  '模块名'

那就安装

1
2
3
cnpm install 模块名 --save-dev(关于环境的,表现为npm run dev 启动不了)
cnpm install 模块名 --save(关于项目的,比如main.js,表现为npm run dev 成功之后控制台报错)
比如escape- string -regexp、strip-ansi、has-ansi、 is -finite、emojis-list

 写示例时注意:

一、一个组件下只能有一个并列的 div,可以这么写,所以复制官网示例的时候只要复制 div 里面的内容就好。

二、数据要写在 return 里面而不是像文档那样子写

 

 

Android

推荐阅读
  • Nginx使用(server参数配置)
    本文介绍了Nginx的使用,重点讲解了server参数配置,包括端口号、主机名、根目录等内容。同时,还介绍了Nginx的反向代理功能。 ... [详细]
  • Android系统源码分析Zygote和SystemServer启动过程详解
    本文详细解析了Android系统源码中Zygote和SystemServer的启动过程。首先介绍了系统framework层启动的内容,帮助理解四大组件的启动和管理过程。接着介绍了AMS、PMS等系统服务的作用和调用方式。然后详细分析了Zygote的启动过程,解释了Zygote在Android启动过程中的决定作用。最后通过时序图展示了整个过程。 ... [详细]
  • 单页面应用 VS 多页面应用的区别和适用场景
    本文主要介绍了单页面应用(SPA)和多页面应用(MPA)的区别和适用场景。单页面应用只有一个主页面,所有内容都包含在主页面中,页面切换快但需要做相关的调优;多页面应用有多个独立的页面,每个页面都要加载相关资源,页面切换慢但适用于对SEO要求较高的应用。文章还提到了两者在资源加载、过渡动画、路由模式和数据传递方面的差异。 ... [详细]
  • loader资源模块加载器webpack资源模块加载webpack内部(内部loader)默认只会处理javascript文件,也就是说它会把打包过程中所有遇到的 ... [详细]
  • 近期,某用户在重启RAC一个节点的数据库实例时,发现启动速度非常慢。同时业务部门反馈连接RAC存活节点的业务也受影响。通过对日志的分析, ... [详细]
  • 浅析Mysql数据回滚错误的解决方法_PHP教程:MYSQL的事务处理主要有两种方法。1、用begin,rollback,commit来实现begin开始一个事务rollback事 ... [详细]
  • 这个问题困扰了我两天,卸载Dr.COM客户端(我们学校上网要装这个客户端登陆服务器,以后只能在网页里输入用户名和密码了),问题解决了。问题的现象:在实验室机台式机上安装openfire和sp ... [详细]
  • 本文介绍了闭包的定义和运转机制,重点解释了闭包如何能够接触外部函数的作用域中的变量。通过词法作用域的查找规则,闭包可以访问外部函数的作用域。同时还提到了闭包的作用和影响。 ... [详细]
  • ScrollView嵌套Collectionview无痕衔接四向滚动,支持自定义TitleView
    本文介绍了如何实现ScrollView嵌套Collectionview无痕衔接四向滚动,并支持自定义TitleView。通过使用MainScrollView作为最底层,headView作为上部分,TitleView作为中间部分,Collectionview作为下面部分,实现了滚动效果。同时还介绍了使用runtime拦截_notifyDidScroll方法来实现滚动代理的方法。具体实现代码可以在github地址中找到。 ... [详细]
  • 微信民众号商城/小顺序商城开源项目介绍及使用教程
    本文介绍了一个基于WeiPHP5.0开发的微信民众号商城/小顺序商城的开源项目,包括前端和后端的目录结构,以及所使用的技术栈。同时提供了项目的运行和打包方法,并分享了一些调试和开发经验。最后还附上了在线预览和GitHub商城源码的链接,以及加入前端交流QQ群的方式。 ... [详细]
  • {moduleinfo:{card_count:[{count_phone:1,count:1}],search_count:[{count_phone:4 ... [详细]
  • 1.官网下载了mysql-5.7.17-win64.zip包,配置遇到很多麻烦,记录一下;2.解压后放到指定的文件夹,修改mysql-5.7.17的配置文件my-default.i ... [详细]
  • Annotation的大材小用
    为什么80%的码农都做不了架构师?最近在开发一些通用的excel数据导入的功能,由于涉及到导入的模块很多,所以开发了一个比较通用的e ... [详细]
  • {moduleinfo:{card_count:[{count_phone:1,count:1}],search_count:[{count_phone:4 ... [详细]
  • 国庆节到了,安利一个Android的自动动态授权插件
    Android的老铁都知道申请权限时,除了要在AndroidManifest添加权限,还需要在activity中通过requestpermission对 ... [详细]
author-avatar
快活林2007
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有