Vue有两个不同的版本，分别是Vue完整版（vue.js）和Vue非完整版（vue.runtime.js），下面来简单的介绍一下Vue两个版本的区别和使用方法。
版本区别
1. 相关定义
- 完整版：同时包含编译器和运行时的版本。
- 编译器（下面用compiler表示）：用来将模板字符串编译成为JavaScript渲染函数的代码。
- 非完整版（运行时版） ：用来创建Vue实例、渲染并处理虚拟DOM等的代码。基本上就是除去编译器的其它一切。
2. 主要区别
最佳实践：总是使用非完整版，然后配合vue-loader和vue文件
思路：
- 保证用户体验，用户下载的 JS 文件体积更小，但只支持 h 函数
- 保证开发体验，开发者可直接在 vue 文件里写 HTML 标签，而不写 h 函数
- 中间的转换过程让 loader 来做，vue-loader把 vue 文件里的 HTML 转为 h 函数
3. 配置
Vue.js(完整版)：从bootcdn引用vue.js或Vue.min.js
Vue.runtime.js：默认使用
使用方法
1. 完整版用法
- 脚手架搭建的项目默认配置的是非完整版，所以要用完整版需要额外配置引用：
- 视图模板写在HTML或者template里：
<body>
<div id="app">
{{n}}
</div>
</body>
或者
new Vue({
el: '#app',
template: `<div>{{n}}</div>`,
data:{
n:0
}
})
- 通过内部配置的compiler解析器解析成Dom节点渲染到页面：
2. 非完整版用法
- 只支持在render函数中创建视图模板：
new Vue({
el: '#app',
render(h){
return h('div',this.n)
},
data:{
n:0
}
})
主要优缺点
1. Vue.js(完整版)
- 优点：逻辑清晰简单，好写好用。
- 缺点：
（1）开发需要额外配置版本引用
（2）视图模板写在HTML/template里，代码量大的时候显得冗余。
（3）需要通过compiler解析器才能把HTML/template模板编译成Dom去渲染，意外增大代码体积
（4）代码体积较非完整版大30%，用户体验较差。
2. Vue.runtime.js非完整版
- 缺点：对初级开发者可能不友好
- 优点：
（1）render函数之强大，它较于HTML/template模板内要写繁琐冗余的代码而言要高效简洁很多，甚至还能在函数体里面进行一些额外的代码逻辑。
（2）不需要解析器，webpack等配置有vue loader，vue loader的作用是在代码打包的时候r调用compiler自动解析编译。
（3） 代码体积较小，提升用户体验。
最佳实践：总是使用非完整版，然后配合vue-loader和vue单文件组件（随心写html代码，render函数直接引入，开发体验棒！）。
使用codesandbox.io写Vue代码
- 进入官网
- 点击 "Create a Sandbox, it's free"
- 选择 "Vue"
三步就可以创建一个Vue项目！还可以把创建开发好的项目代码下载到本地：选择左上角的file——然后Export to ZIP
