创建一个入门的Vue项目

vue还是比较容易上手的，所以获得开发者的青睐，这是一个原因。下面记录一下，创建一个入门vue项目的过程，记录自己学习的点滴。

首先

需要满足的前提：安装node.js和npm以及安装需要的工具webpack和vue-cli，从Node.js官网下载对应平台的安装程序，目前版本的node.js都已经集成了npm，所以安装node.js就可以了。安装完成后，在windows环境请打开命令提示符，然后输入node -v，如果安装正常，你应该看到v6.10.3这样的输出：

C:\Users\John>node -v

v6.10.3

那么npm是什么呢，我之前写过一篇文章，戳这里：https://www.haoht123.com/1054.html

输入npm -v，如果安装正常，你应该看到3.10.10这样的输出：

C:\Users\John>npm -v

3.10.10

安装webpack，依然是在命令行安装，输入npm install webpack -g，其中-g代表全局安装，是英文global的缩写。输入webpack -v，如果如下方显示4.17.1，则表示安装正常。

C:\Users\John>webpack -v

4.17.1

安装vue -cli，依然是命令行安装，输入npm install vue-cli-g。完成后输入vue -V（注意是大写的V)，如果下方显示2.9.1，则表示安装正常。

C:\Users\John>vue -V

2.9.1

然后

输入vue init webpack demo demo是你要创建的项目名字，本文以demo为例，注意：不可以为中文，一路回车，等待下载完成就好。

创建完成的目录结构以及描述如下：

最后

输入npm run dev运行项目，如果出现了以下页面，则表示success：

完。