vue独立构建与运行时构建的区别

915 阅读1分钟

vue项目运行的过程

vue项目在运行的过程中主要有两步:

  1. 将字符串模板编译为渲染函数(render),这一步称为编译过程
  2. 运行时调用第一步中生成的渲染函数,这一步称为运行过程

因此,vue的运行构建有两种模式:独立构建版本(编译+运行);运行时构建版本(运行)

选择哪种版本

当我们在代码中直接使用template传参的时候,需要借助编译器将template参数转换为render函数,此时需要使用独立构建版本。当我们使用render函数或者使用单文件组件中的模板来渲染的时候,可以使用运行时模式,因为它们已经直接或者通过vue-loader被转换为render函数了。

两者的区别

  1. 包大小的区别,运行时构建版本比独立构建版本的代码要小
  2. 编译的时机不同,独立构建版本是运行时编译,性能会有一定的损耗;运行时版本是借助loader做的离线编译,运行性能更高