搭建Vue脚手架

1、安装node.js

官网下载并安装，一路‘next’就可以。安装成功后在cmd命令行验证一下，输入node -v，若如下图所示说明安装成功。

图1

我们所需要的npm包管理器，是集成在node中的，所以，直接输入npm -v就会如下图所示，显示出npm的版本信息。

图2

2、 安装cnpm

点击进入淘宝的cnpm网站,里面有详细的配置方法。 或者直接在命令行输入：

这就开始下载了。

图3

3、 vue安装

输入 cnpm install vue，如下图所示

图4 

4、安装vue-cli脚手架构建工具

vue-cli 提供一个官方命令行工具，可用于快速搭建大型单页应用。该工具提供开箱即用的构建工具配置，带来现代化的前端开发流程。只需几分钟即可创建并启动一个带热重载、保存时静态检查以及可用于生产环境的构建配置的项目：

图5

5、创建一个基于 webpack 模板的新项目

要创建项目，首先我们要选定目录，然后再命令行中把目录转到选定的目录。可以使用：

图6

例如上图，这样我就在C:\Users\DELL路径下创建了一个名为answer_sheet的项目。

接下来是一些配置选项，我常用的配置过程如下：

图7

需要注意的是项目的名称不能大写，不然会报错。

6、  安装项目所需要的依赖

刚创建的项目是没有依赖的所以还不能顺利运行。所以在这之前需要解决项目的依赖问题，使用下面的命令安装项目的依赖。

图8

接下来可以运行项目了。

图9

看到它，我们就成功了。

图10