首先列出我们需要的东西：node.js环境（npm包管理器）vue-cli脚手架搭建工具cnpmnpm淘宝镜像安装node.js从node.js官网下载安装node，安装过程非常简单，一路“下一步”即可（傻瓜式安装）。安装完成后，打开命令行工具，输入node-v，如下图。如果出现相应的版本号，则安装成功。npm包管理器npm包管理器集成在node中，所以直接输入npm-v会显示npm的版本信息，如下图。因为一些npm资源被屏蔽或者国外资源，经常导致用npm安装依赖包失败，所以还是需要npm的国内镜像---cnpm。安装cnpm，在命令行输入npminstall-gcnpm--registry=http://registry.npm.taobao.org。安装完成后，可以使用cnpm代替npm安装依赖包。安装vue-cli脚手架搭建工具，在命令行运行命令cnpminstall-gvue-cli（注意这里使用cnpm而不是npm，否则速度超级慢。）通过以上步骤，环境和需要准备的工具已经准备好了，然后开始使用vue-cli来构建项目。使用vue-cli构建项目创建项目首先我们需要选择一个目录，然后在命令行中将目录更改为选择的目录。这里我选择的是桌面来存放新建的项目，那么我们需要先将目录cd到桌面，如下图。在命令行运行命令vueinitwebpackfirstVue，会在桌面生成项目目录。解释这个命令。这个命令的意思是初始化一个项目，这里的webpack是构建工具，也就是整个项目都是基于webpack的。其中firstVue是整个项目文件夹的名称，如下图。在运行初始化命令时，让用户输入几个基本选项，如项目名称、描述、作者等信息。如果不想填写，直接回车默认即可。这是整个项目的目录结构，其中我们主要对src目录进行修改。本项目还只是一个结构框架，整个项目需要的依赖资源还没有安装，如下图。安装项目需要的依赖。在项目目录下执行命令cnpminstall安装依赖。安装完成后，在项目目录的firstVue文件夹下会多出一个node_modules文件夹，这是项目需要的依赖包资源。运行项目在项目目录下运行命令npmrundevnpmrundev命令中的“run”对应package.json文件中scripts字段中的dev，是节点build/dev-server的快捷方式。js命令。运行成功
