Vue的完整版与非完整版

149 阅读1分钟

区别:

  1. Vue 两个版本间的区别就是有没有编译器。 完整版:同时包含编译器和运行时的版本。

非完整版:只包含运行时版,用来创建 Vue 实例、渲染并处理虚拟 DOM 等的代码。基本上就是除去编译器的其它一切。

编译器(compiler):用来将模板字符串编译成为 JavaScript 渲染函数的代码。

  1. 我们在写视图的时候,完整版可以直接写在 HTML 或 template 选项里,而非完整版只能写在 render 函数里。
// 有编译器
new Vue({ 
  template: '<div>{{ hi }}</div>' 
}) 


// 没有编译器 
new Vue({ 
  render (h) { 
    return h('div', this.hi) 
  } 
})
  1. CDN 引入的后缀
完整版只包含运行时版完整版(生产环境)只包含运行时版(生产环境)
CDN引入vue.jsvue.runtime.jsvue.min.jsvue.runtime.min.js
  1. webpack 引入和 @vue/cli 引入的默认配置都是非完整版的,如果你希望使用完整版的话需要额外配置。

总结:

因为运行时版本相比完整版体积要小大约 30%,所以应该尽可能使用这个版本,然后配合vue-loader 或 vueify 使用。