vue项目的新建
-
全局安装vue-cli
-
vue-cli安装
npm install vue-cli -g
-
vue-cli的版本查看
vue -V
-
vue-cli的3.0+以后使用的不是vue-cli了,如果用以上的安装命令安装的并不是最新版的3.0+的,而如果安装3.0的话就需要使用新的
npm install @vue/cli -g
-
如果原来已经安装了vue-cli的话需要先卸载原来的安装
npm uninstall vue-cli -g
-
-
创建webpack项目
-
创建webpack项目
vue init webpack [projectname]
-
项目名称,如果不需要就直接回车。注:此处项目名不能使用大写
Project name (my-project)
-
项目描述,如果不需要就直接回车。
Project description (A Vue.js project):
-
项目作者,默认计算机用户名
Author (xxx):
-
构建方式(暂且这么解释)
两个选择(上下箭头选择,回车即为选定)建议选择 : Runtime + Compiler:recommended for most users
这里推荐使用1选项,适合大多数用户的vue build (Use arrow keys) // 1. (译:运行+编译:被推荐给大多数用户) > Runtime + Compiler:recommended for most users // 2.(译:只运行大约6KB比较轻量的压缩文件,但只允许模板(或任何VUE特定HTML)。 // VUE文件需要在其他地方呈现函数。翻译不精准,意思大概是选择该构建方式对文件大小有要求) > Runtime-only:about 6KB lighter min+gzip,but templates (or any Vue-specific HTML) are ONLY allowed in .vue files-render functions are required elsewhere
-
安装vue的路由插件,需要就选y,否则就n
建议 : Y
install vue-router?
-
是否使用ESLint检测你的代码?
ESLint 是一个语法规则和代码风格的检查工具,可以用来保证写出语法正确、风格统一的代码。
建议选择 ‘N’ 因为选择 ‘Y’ 在做调试项目时,控制台会有很多 黄色警告 提示格式不规范,但其实并不影响项目Use ESLint to lint your code?
-
是否安装单元测试(暂不详细介绍)
建议 : N
Setup unit tests?
-
是否安装E2E测试框架NightWatch(E2E,也就是End To End,就是所谓的“用户真实场景”。)
建议 : N
Setup e2e tests with Nightwatch(Y/n)?
-
项目创建后是否要为你运行“npm install”?这里选择包管理工具
选项有三个(上下箭头选择,回车即为选定)可以选择
yes use npm
,但是国直接用npm run insert
因为有墙所以安装时常出问题,所以在这个问题上建议选择no,I will handle that myself
,然后 cd 到自己的项目中使用淘宝镜像安装 :npm install --registry=https://registry.npm.taobao.org
Should we run 'npm install' for you after the project has been created? // 使用npm yes,use npm // 使用yarn yes,use yarn // 自己操作 no,I will handle that myself
-
淘宝镜像
npm install --registry=https://registry.npm.taobao.org
-
-
安装完成后运行项目
npm run dev