使用vue-cli(vue脚手架)快速搭建项目框架

整个过程是基于已经安装node.js和cnpm的基础上；

•安装node.js.

官网下载地址：http://nodejs.cn/download/
安装参考文档：https://blog.csdn.net/qq_42543312/article/details/82191357

注意：至少 node.js +6 以上，否则，会报错：

检测node.js 和npm 版本：

1.WIN+ R;
2.运行窗口输入：cmd;
3.输入检测信息：

•使用 vue-cli 搭建项目：

1.全局化安装cnpm:

下载淘宝镜像命令：npm install cnpm -g --registry=https://registry.npm.taobao.org

注： 安装vue-cli，使用npm命令和cnpm命令都是可以的，使用npm安装的比较慢，而且很可能会因为网络问题而出错，所以还是使用cnpm稳一点。

运行结果示例：

全局安装 vue-cli ，在命令提示窗口执行：

cnpm install -g vue-cli

运行示例：

出现以上提示表示vue-cli正常安装成功，可以正式创建vue-cli工程项目了。

安装vue-cli成功后，通过cd命令进入你想放置项目的文件夹，在命令提示窗口执行创建vue-cli工程项目的命令：

存放代码的文件夹：


在命令提示窗口执行创建vue-cli工程（项目）的命令：vue init webpack

运行示例：(项目名称中不能有大写字母)


确认创建项目后，后续还需输入一下项目名称、项目描述、作者、打包方式、

是否使用ESLint规范代码等等，详见上图。

安装顺利执行后会，生成如下项目文件目录：

打开 VScode, 将项目文件夹拖拽到vscode 中：


生成文件目录后，使用 cnpm 安装依赖：cnpm install

最后需要执行命令： npm run dev 来启动项目，启动完成后会自动弹出默认网页：

地址栏输入：http://localhost:8080/ 点击「回车」。

参考文档地址：https://www.jianshu.com/p/1ee1c410dc67

Vue 2.0=完整命令总结====================

准备工作：创建文件夹 --> cmd 到当前文件夹下。
1、检测node.js版本： node -v (v6+)
2、检测npm版本： npm -v
3、下载淘宝镜像：
npm install cnpm -g ss --registry=https://registry.npm.taobao.org
4、安装全局脚手架： cnpm install -g vue-cli
5、脚手架创建Vue项目: vue init webpack
6、将项目文件夹拖拽到Vscode中,Terminal 中运行如下命令。
7、下载项目依赖：cnpm install
8、运行项目：npm run dev