vue中runtimecompiler和runtimeonly的区别

简单总结如果在之后的开发中，你依然使用template，就需要选择runtimecompiler如果你之后的开发中，使用的是.vue文件夹开发，那么可以选择runtimeonlyruntimecompilerVue中的模板如何最终渲染成真实DOMtemplate -> ast -> render -> vdom -> UIruntimeonlyVue中的模...

a1345954104

12154人浏览 · 2020-03-20 12:38:32

a1345954104 · 2020-03-20 12:38:32 发布

简单总结
如果在之后的开发中，你依然使用template，就需要选择runtimecompiler
如果你之后的开发中，使用的是.vue文件夹开发，那么可以选择runtimeonly

runtimecompiler
在这里插入图片描述
Vue中的模板如何最终渲染成真实DOM
template -> ast -> render -> vdom -> UI

runtimeonly
在这里插入图片描述
Vue中的模板如何最终渲染成真实DOM
render -> vdom -> UI
性能更高
代码量更少
那么.vue文件中的template是由谁处理的
是由vue-template-compiler

runtime-only 更快的原因：
runtime-only比runtime-compiler更快，因为它省略了vue内部过程中的第一个过程，如果是runtime-compiler那么main.js中就会出现template从而需要过程一导致增加了一个过程，同时增加了大小而 runtime-only 模式中不是没有写 template ，只是把 template 放在了.vue 的文件中了并有一个叫 vue-template-compiler的在开发依赖时将.vue文件中的 template 解析成 render 函数了因为是开发依赖，不在最后生产中，所以最后生产出来的运行的代码没有template

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^