vue的完整版和运行时版的区别

完整版和运行时版

打开vue的官网，你会发现有vue有两种不同的构建版本，Vue官方对两种不同构建版本的解释是这样子的：

• 完整版：同时包含编译器和运行时的版本（编译器：用来将模板字符串编译为js渲染函数的代码）

• 运行时：用来创建Vue实例，渲染并处理虚拟DOM等的代码，基本上就是出去编译器的其它一切。

两种版本	UMD	Commonjs	基于构建工具使用	直接用于浏览器
完整版	vue.js	vue.common.js	vue.esm.js	vue.esm.browser.js
运行时版	vue.runtime.js	vue.runtime.common.js	vue.runtime.esm.js

两种版本的区别

比较列	完整版	运行时版	评价
特点	有compiler	没有 compiler	完整版体积较大，其中仅compiler就占整个文件40%大小
视图	写在html中或者写在template选项中	写在 render 函数里，用 h 来创建标签	h 是尤雨溪写好传给 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 函数。

vi设计http://www.maiqicn.com 办公资源网站大全https://www.wode007.com