从零开始，创建一个VUE项目，详细图文详解。

准备工作

• 1、安装VScode 点击下载
• 2、安装node 点击下载
• 3、安装npm 点击下载

一、步骤详解

1、创建项目的文件夹。比如F盘下新建一个名为MyDemo的文件夹，打开VScode进入MyDemo文件夹。

2、安装脚手架。输入npm install -g vue-cli 命令，回车。（-g 代表全局安装，下次新建项目就不用安装脚手架了）

3、新建一个项目。输入vue init webpack mydemo， mydemo 是自定义的项目名称，注意不能有大写字母，回车。

在安装时会询问你:

①Project name (mydemo)；

【项目名称（mydemo），可以直接按回车，也可以自定义，注意不能有大写字母】(这个名字就是运行时，浏览器标题栏显示的名字！)

② Project description (A Vue.js project)；

【项目描述（一个vue.js项目），可以直接按回车，也可以自定义】

③Author (xzb)；

【项目作者（xzb），可以直接按回车，也可以自定义】

④Vue build (Use arrow keys)>

Runtime + Compiler: recommended for most users（大多数用户推荐）

Runtime-only: about 6KB lighter min+gzip, but templates (or any Vue-specificHTML) are ONLY allowed in .vue files - render functions are required elsewhere；

【不知道啥意思，默认选自第一项，直接回车】

⑤Install vue-router? (Y/n)；

【问是否安装路由？ 可安可不安，建议安装，输入y，按回车】

⑥Use ESLint to lint your code? (Y/n)；

【问是否使用ESlint语法？不了解ESLint语法就不使用，输入n，按回车】

⑦Setup unit tests with Karma + Mocha? (Y/n)；

【问是否设置单元测试？不设置，输入n，按回车】

⑧Setup e2e tests with Nightwatch? (Y/n)；

【问是否和Nightwatch建立端到端的测试？不建立，输入n，按回车】

⑨Should we run npm install for you after the project has been created? (recommended) npm

【问是否要安装依赖？可安可不安，建议安装，输入y，按回车】

6、把刚才创建的项目mydemo添加到工作区，点击右下角的 + 号，在下拉列表中点击mydemo。

7、如果上面第⑨步没有安装依赖， 就在终端输入npm install 命令，回车。

命令运行完毕，打开package.json，找到start 查看运行项目的命令，一般都是npm run dev，也可以自定义。在终端中输入npm run dev命令，回车。

8、项目运行成功，按住Ctrl键，单击红色部分，就可以在浏览器打开 http://localhost:8080，看到欢迎页了~

常见问题

1、 修改项目名

打开package.json，把name的值改成你想要的项目名，然后删掉整个 node_modules 文件夹，重新运行npm install命令就好了。

2、修改运行端口

打开config文件夹下面的index.js,找到port，把值改成你电脑上没被占用的端口就好了。下面的aotuOpenBrowser是当你npm run dev之后是否自动打开游览器。