手动创建vue项目

手动创建vue项目的步骤

1. 安装node.js

2. 运行安装vue-cli脚手架

首先进入到命令行窗口中,输入以下命令：

npm install vue-cli -g

3. 初始化项目

我们需要进入到存放项目的位置，然后输入下面命令：

vue init webpack vue-demo 

初始化vue项目 其中vue-demo 为项目名称

安装的过程中会提示一下问题（需要一步一步的完成）：

1. Project Name （vue-demo） 项目名称（输入完按enter键）
2. Project description（A Vue.js project） 项目描述
3. Author 作者 （按enter键）
4. Vue build （按enter键）
   • Runtime + Compiler: recommended for most users (运行时+编译时 建议用户使用此项)
   • 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 (仅运行时)
5. Install vue-router 安装路由（按Y）
6. Use ESLint to lint your code? (使用ESlint语法,建议初学者选择N；如果使用ESLint语法，可能会出现很多报错，需要熟悉ESLint语法，也可以挑战学习下）
   如果选择Y Pick an ESLint preset 选择ESLint预设 （Standard）
7. set up unit tests 设置单元测试 （按N）
8. Setup e2e tests with Nightwatch Nightwatch建立端到端的测试(按N)
9. Should we run'npm Install' for you after the project） has bean created?(recommended) （选Yes，use NPM）

选择完后，直接等待构建，构建完成后如下图：

vue项目创建成功

构建完成后就出现如上图中前4行所示， 提示我们进入到项目的目录，

4. 运行项目

npm run dev

执行npm run dev 运行项目，运行完成后会出现运行项目的链接，直接在浏览器中访问此链接就可以看到创建的项目了。