在前面的第一节中，我们安装好了基础开发工具，接下来介绍如何搭建基础环境，并且搭建一个基础的webpack 项目。

安装vue、webpack 和 vue-cli

$ npm install vue@2.6.11 -g
$ npm install webpack@4.42.1 -g
$ npm install vue-cli@2.9.6 -g

// 查看安装列表
$ npm list -g --depth=0
D:\Nodejs\node_global
├── vue@2.6.11
├── vue-cli@2.9.6
└── webpack@4.42.1

创建工程

打开控制台，创建工程名为 demo 的工程项目，创建过程及命令如下，在创建过程中一直回车即可，其中部分输入y 或者 n， 具体可参照下方

$ vue init webpack demo

? Project name (demo)
? Project name demo
? Project description (A Vue.js project)
? Project description A Vue.js project
? Author (zhangji85 <1808240436@qq.com>)
? Author zhangji85 <1808240436@qq.com>
? Vue build (Use arrow keys)
? Vue build standalone
? Install vue-router? (Y/n) y
? Install vue-router? Yes
? Use ESLint to lint your code? (Y/n) n
? Use ESLint to lint your code? No
? Set up unit tests (Y/n) n
? Set up unit tests No
? Setup e2e tests with Nightwatch? (Y/n) n

配置工程

进入创建好的工程目录，并执行 npm install 安装相关依赖：

$ cd demo/
$ npm install

运行项目

相关依赖安装完成后，可输入 npm run dev 来运行项目

$ npm run dev

运行后控制台显示如下即为完成：

此时在浏览器中输入网址 http://localhost:8080 即可打开项目页面，页面如下图所示：

至此，一个基本的vue 项目搭建完成。

附：如想详细学习Vue.js 相关知识，推荐参考书籍《Vue.js实战》（梁灏）。