一、准备工作

• nodejs : JavaScript运行环境
• npm : nodejs下的包管理器（是国外的，在国内使用会很慢），可以使用国内的淘宝npm镜像
• webpack: 把无法直接在浏览器中使用的语言（如es6,sass）编译成浏览器支持的形式，资源的合并、压缩混淆
• vue-cli：直接构建vue项目

---

二、下载安装

2.1 nodejs

  nodejs官网（https://nodejs.org/en/）下载安装最新版本。安装成功后使用管理员身份运行cmd命令行管理工具（win10下很多命令需要管理员权限，所以后续命令行操作都使用管理员权限下操作，防止出现一些奇奇怪怪的错误）。

输入命令：node -v

出现版本号说明安装成功

2.2 安装淘宝镜像

  由于npm是国外的，使用起来比较慢，我们这里使用淘宝的cnpm镜像来安装vue.
淘宝的cnpm命令管理工具可以代替默认的npm管理工具。

输入命令：npm install -g cnpm --registry=https://registry.npm.taobao.org

安装成功截图

2.3 搭建vue-cli脚手架

输入命令：cnpm install --global vue-cli

安装过程

2.4 安装webpack

输入命令: npm install webpack@3.12.0 -g

三、创建Vue项目并运行

3.1 创建项目

  进入你想存放vue项目的文件夹，打开cmd。

输入命令：vue init webpack first_vue

注意first_vue是自己起的项目名，根据需要选择yes/no,可以默认一直回车。

安装过程

3.2 安装依赖

  创建成功后进入创建的项目，打开cmd。

输入命令：cnpm install

安装依赖

3.3 运行

输入命令：cnpm run dev

运行成功
运行成功后，打开浏览器输入默认地址http://localhost:8080。
运行成功

于2019/6/3测试运行成功