vue-cli（vue.js脚手架）安装成功记录

Step：

1，安装node.js

2，安装cnpm

3，安装webpack

4，安装vue-cli

5，安装前端项目

6，运行成功

7，如何卸载

8，其他

一，安装node.js

1，打开https://nodejs.org/en/官网下载node.js

2，安装Node.js，打开下载的文件一直下一步安装成功

3，确认安装成功，执行命令：node -v

二，安装cnpm

1，安装完node.js后，npm命令即可以使用了，可执行命令：npm -v 查看版本

2，在这里我们使用国内镜像，提高下载速度，所以安装cnpm，后面需要用到npm命令的，不要交替使用，一律改用cnpm

执行命令： npm install -g cnpm --registry=https://registry.npm.taobao.org 安装cnpm( -g 代表global全局得意思)，安装成功后输入 cnpm -v 查看

三，安装webpack

1，执行命令： cnpm install webpack -g 安装，然后输入 webpack -v 查看版本确认成功

2，如果遇到以下提示，请执行命令： cnpm install --g webpack-cli 继续安装，然后再次输入 webpack -v 后，即可看到版本

好，安装vue-cli之前的步骤进行到这里，咱们先总结确认下成果，执行命令：

node -v

cnpm -v

webpack -v

全部出现版本号即表示成功，可以进行下一步。

四，安装vue-cli

安装vue-cli：cnpm install -g vue-cli

版本查看：vue -V（大写）

五，安装前端项目

第一种，在线安装

1.1，建立vue安装目录，然后在cmd里将路径切换为该目录，参考我的：

1.2，执行命令： vue init webpack demo （wepback--模板，demo--项目），一直回车下一步即可。

1.3，安装完毕后会在D盘demo目录下生成一个目录名称为demo，目录下文件：

1.4，执行命令

cd demo

cnpm run dev

1.5，浏览器里输入url：http://localhost:8080，出现下面页面即表示安装vue-cli成功。

1.6，容易出现的错误：

1.6.1

vue-cli · Failed to download repo vuejs-templates/webpack: connect ECONNREF......，

如果出现这个，找到C:\Windows\System32\drivers\etc中的host文件（win10），打开添加

192.30.253.112 github.com
151.101.88.249 github.global.ssl.fastly.net

1.6.2

vue-cli · Failed to download repo vuejs-templates/wepback: Response code 404 (Not Found)

这个是执行命令时单词拼写错误后引起的

保存后重复上面1.1 - 1.5步骤

第二种，离线安装