Vue是什么
渐进式 JavaScript 框架
这是 Vue 官网上的一句简介，没错，就是这样，既然会看到这篇文章，就应该知道它是干嘛的，至于渐进式以后再说吧，先学会如何用它。
快速搭建开发环境
Vue已有一个官方的脚手架vue-cli，很好用，适合SPA(单页应用)开发，当然，很多人也根据vue-cli改出了适合多页的项目。
不多说，开始干，先去vue-cli官网看看。
Prerequisites: Node.js (>=4.x, 6.x preferred), npm version 3+ and Git.
首选需要 Node.js、npm、Git，如果没有就先安装这一系工具。
安装Node.js，推荐LTS版本，简单说是稳定版，Current约等于体验版。几个比较大平台的系统都有对应的安装包，按照提示下一步就好了，安装好Node.js，npm应该也会相应的安装上。
在终端/CMD中查看版本号检验是否安装好。
node -v ##回车
npm -v ##回车
Node.js Node.js是一个基于Chrome JavaScript运行时建立的平台， 用于方便地搭建响应速度快、易于扩展的网络应用。简单说，可以用JavaScript写服务器端的应用，与PHP、JAVA相似了。
NPM的全称是Node Package Manager，是一个NodeJS包管理和分发工具，已经成为了非官方的发布Node模块（包）的标准。简单说，一个公共代码库，可以上传(发布)、下载。
Git 的安装方式和其他软件相差无几，到官网下载安装包，一步一步下去就好了。
必须的准备工作做好了，开始倒腾 vue-cli，打开终端/CMD
npm install -g vue-cli ##回车
通过npm安装vue-cli这个工具包，并且是全局安装。
终端/CMD通过命令进入某个文件夹，例如www文件夹
cd www ##回车
然后在新建一个文件夹作为你的项目文件夹，并且初始化它
vue init webpack my-project ##回车
## 各种提示确认
## 前期不推荐开启 linting、testing
执行这个命令，当前(www)文件夹下，会新建一个名为my-project的文件夹，并且会在文件夹内生成一些文件。假若已有同名文件夹，会提示是否合并。
vue init 模板类型 文件夹名称
vue-cli提供了大概五种模板，各有不同的玩法。
根据提示，进入my-project文件夹，开始安装依赖。
cd my-project ##回车
npm i ##回车
## 待各种依赖安装好后
npm run dev ##开启开发模式，浏览器会自动打开一个地址，修改文件就立马可以看见修改的东西。
大概的过程就是，通过命令确认使用哪种模板，在哪个文件夹下初始化，并且通过一步一步的命令确认配置信息，确认好后，通过Git把Github上的模板文件复制到文件夹。
Github偶尔被墙，所有初始化的时候不要着急哟。
不要开发环境直接撸
当然这样也是可以的，就如同以往开发方式一样，写好代码直接往浏览器里扔。
直接通过script标签或AMD加载器加载。
开始上手撸代码
没错，接下来就按照官网的教程撸就好了，都是各种简单的实例。
需要扩展延伸的知识点
- 前端模块化
- Node.js
- webpack
- es6
转载请注明：OnlyLing - Web 前端开发者 » 快速上手Vue（一）