【Vue】深入了解Vue完整版与非完整版
目录
术语完整版Vue非完整版Vue深入理解两个版本的区别引用出错的结果
一、术语
编译器：用来将模板字符串编译成为JavaScript渲染函数的代码
运行时：用来创建Vue实例、渲染并处理虚拟DOM等的代码。基本就是除去编译器的其他一切。
二、完整版
-
完整版体积大（假设它占比100K），功能强，有编译器。 -
vue.js包含注释信息，全部的代码
vue.min.js
不包含注释信息，只是代码
三、非完整版
-
非完整版体积小（相比于完整版为70K），功能弱，没有编译器。 -
vue.runtime.js包含注释信息，全部的代码
-
vue.runtime.min.js不包含注释信息，只是代码
四、深入理解两个版本的区别
| Vue完整版 | Vue非完整版 | 评价 | |
|---|---|---|---|
| 特点 | 有compiler | 没有compiler | compiler占40%体积 |
| 视图 | 写在HTML里，或者卸载template选项里 | 写在render函数里用h来创建标签 | h是vue作者(尤雨溪)写好传给render的 |
| cdn引入 | vue.js | vue.runtime.js | 文件不同，生产环境后缀为.min.js |
| webpack引入 | 需要配置alias | 默认使用此版 | 尤雨溪配置 |
| @vue/cli | 需要额外配置 | 默认使用此版 | 尤雨溪、蒋豪群配置 |
最佳实践：总是使用非完整版，然后配合vue-loader和vue文件。-
思路：- 保证用户体验，用户下载的JS文件体积更小，但支持h函数
- 保证开发体验，开发者可直接在vue文件里写HTML标签，而不写h函数。
- 脏活让loader做，vue-loader把vue文件里的HTML转为h函数。
五、引用出错的后果
-
vue.js错用成vue.rentime.js无法将HTML编译成视图
-
vue.runtime.js错用成vue.js代码体积变大而已，因为vue.js有编译HTML的功能