runtime-compiler和runtime-only区别

最新推荐文章于 2022-03-15 15:13:07 发布

Eli-sun

最新推荐文章于 2022-03-15 15:13:07 发布

阅读量387

点赞数

分类专栏： Vue-cli 文章标签：前端

本文链接：https://blog.csdn.net/vfjcgg/article/details/106998380

版权

Vue-cli 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

runtime-compiler(v1)
template->ast->render->virtual dom->真实DOM->UI

runtime-only (v2)(1.性能更高 2.代码量更少)
render->vdom->UI

 render: h => h(App)

这里的h函数是vue基于vdom自己封装的函数，用于把vdom转换成dom节点

// const cpn={
//   template:'<div>{{message}}</div>',
//   data(){
//     return{
//       message:'我是组件message'
//     }
//   }
// }

new Vue({
  el: '#app',
  // render: h => h(App)
  render:function (createElement) {

    //1.普通用法:createElement('标签‘，{标签的属性},[''])
    // return createElement('h2',
    //   {class:'box'},
    //   ['Hello World',createElement('button',['按钮'])])

    //2.传入组件对象：
    return createElement(App)

createElement里面可以传入一个组件

runtime-compiler和runtime-only的区别：
简单总结：
如果在之后的开发中，你依然使用template,就需要选择runtime-compiler
如果你之后的开发中，使用的是.vue文件夹开发，那么可以选择runtime-only