vue.js 安装

兼容性

vue.js 不支持 IE8及其以下版本，因为vue使用了IE8无法模拟的ECMAScript 5 特性。但是支持所有兼容 ECMAScript 5 的浏览器。

Vue Devtools

在使用vue.js时候，浏览器可以安装 Vue Devtools。可以帮助在更好的界面中审查和调试 Vue 应用。

直接使用 <script> 标签引入

⚠️ 在开发环境中不要使用压缩版本，会失去所有常见错误的相关警告。

直接下载并用 <script> 标签引入， Vue 会被注册为一个全局变量。

CDN

https://cdn.jsdelivr.net/npm/vue 与npm 发布的最新版本一致。
https://cdn.jsdelivr.net/npm/vue/ 浏览 npm 包资源。

命令行工具（CLI）

⚠️ 熟悉 Vue 本身之后在使用CLI。

# 全局安装 vue-cli
npm install -g vue-cli
# 创建一个基于webpack 模板的新项目
vue init webpack # 安装依赖
cd npm install
npm run dev

对不同构建版本的解释

在npm 包中的 dist/ 目录中存在多种不同的Vue.js构建版本。

	UMD	CommonJS	ESModule
完整版	vue.js	vue.common.js	vue.esm.js
只包含运行时	vue.runtime.js	vue.runtime.common.js	vue.runtime.esm.js
完整版（生产环境）	vue.min.js	–	–
只包含运行时（生产环境）	vue.runtime.min.js	–	–

术语：

完整版：同事包含编译期和运行时的版本。
编译器：用来将模板字符串编译成Javascript 渲染函数的代码。
运行时：用来创建 Vue实例、渲染并处理虚拟DOM等的代码。基本就是除去编译器的其它一切。

UMD:UMD版本可以通过 <script> 标签直接用在浏览器中。 jsDelivr CDN的https://cdn.jsdelivr.net/npm/vue 默认文件就是运行时 + 编译器的 UMD 版本（vue.js）。

CommonJS: CommonJS版本用来配合 老的打包工具比如 Browserify 或者 webpack1。这些打包工具的默认文件（pkg.main）是只包含运行时的CommonJS版本（vue.runtime.common.js）;

ESModule: ES module版本用来配合现代打包工具 比如 webpack2 或Rollup。这些打包工具的默认文件（pkg.module）是只包含运行时的 ES Module 版本（vue.runtime.esm.js）;

运行时+编译器 vs.只包含运行时

若需要在客户端编译模板（比如传递一个字符串给template选项，或者挂载到一个元素上并以其DOM内部的HTM作为模板），就需要加上编译器，即：

new Vue({
    template:"<div>{{hi}}</div>"
});


new Vue({
    render(h){
        return h('div',this.hi);
    }
});

当使用 vue-loader 或 vueify 的时候， *.vue 文件内部的模板会在构建时预编译成javascript。在最终打包好的包里实际上是不需要编译器的，所以只用运行时版本即可。

运行时版本相比于完整版本体积要小大约30%，所以应该尽可能使用这个版本，如果仍然希望使用完整版本，则需要在打包工具里配置一个别名。