（笔记整理）Vue.js环境搭建（2）

参考文档链接：
一、 Vue的安装及使用快速入门
二、Vue.js环境搭建

Vue.js环境搭建

1，安装Node环境
Vue项目通常通过webpack工具来构建，而webpack命令的执行是依赖node.js的环境的，所以首先要安装node.js。node.js的官方地址为：https://nodejs.org/en/download/，下载相应版本安装即可。

安装完毕之后，在命令行下验证是否安装成功：输入npm -v ，显示版本信息就表示安装成功。

一、安装node环境

Vue项目通常通过webpack工具来构建，而webpack命令的执行是依赖node.js的环境的，
所以首先要安装node.js。node.js的官方地址为：https://nodejs.org/en/download/，
下载相应版本安装即可。
Node.js简介
简单的说 Node.js 就是运行在服务端的 JavaScript。
Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。
Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型，使其轻量又高效。Node.js 的包管理器 npm，是全球最大的开源库生态系统。
下载Node.js

安装Node.js
下载完成后，双击“node-v6.9.2-x64.msi”，开始安装Node.js

逐步默认【Next】操作，直到 【Finish】完成

安装完毕之后，
在命令行下验证是否安装成功：
开始-运行-cmd回车，进入命令窗口

输入
npm -v，
显示版本信息就表示安装成功。

二、安装cnpm

安装完node之后，npm包含的很多依赖包是部署在国外的，为了加快依赖包的加载速度，开发中一般选择使用国内的镜像。cnpm是淘宝对npm的镜像服务器，安装命令如下：
为了提高我们的效率，可以使用淘宝的镜像：http://npm.taobao.org/

npm install -g cnpm --registry=https://registry.npm.taobao.org

安装完成

检查是否安装成功：

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

安装中

完成

安装完后，检查是否安装成功，输入vue(或者使用vue -v查看版本信息)，出现相关的帮助信息则说明安装成功。

四、新建项目
新建一个项目文件夹（如 vue），cd到此文件夹，输入init命令新建一个vue项目:
vue init webpack vue-demo

都是回车创建默认值

安装完成

五、安装依赖
接下来，cd到vue-demo 文件夹下，执行命令安装项目依赖包：
cnmp install

接下来，在命令行里输入命令： cnpm run dev，执行完成后启动项目，浏览器出现以下接结果，说明启动成功。

打开浏览器，输入网址：http://localhost:8080/#/

以上有几个操作过程中遇到的问题：
1、VUE-CLI 脚手架 是什么
vue脚手架指的是vue-cli，它是一个专门为单页面应用快速搭建繁杂的脚手架，它可以轻松的创建新的应用程序而且可用于自动生成vue和webpack的项目模板。
npm install vue-cli -g该命令是脚手架安装

卸载脚手架 命令
npm uninstall vue-cli -g //或者 yarn global remove vue-cli（暂时用不到）

2、生成项目
首先需要在命令行中进入到项目目录，然后输入：
（1）vue init webpack Vue-Project
这里的Vue-Project 是指新建的项目名称 ，一开始还以为是命令的一部分，然后进入项目目录（cd Vue-Project），使用 cnpm 安装依赖
（2）cnpm install
注意 这里的顺序是，先创建项目，再安装依赖
最后启动项目
（3）npm run dev

此处说明下：新版的Node.js已自带npm，安装Node.js时会一起安装，npm的作用就是对Node.js依赖的包进行管理，也可以理解为用来安装/卸载Node.js需要装的东西