我们在使用vue的时候,可以引用两个不同版本的vue,分别是Vue完整版(vue.js)和Vue不完整版(vue.runtime.js)。那么他们的区别是什么呢?今天我们就来分析一下这两个版本的区别,一起看看。
我们在使用vue的时候,可以引用两个不同版本的vue,分别是Vue完整版(vue.js)和Vue不完整版(vue.runtime.js)。那么他们的区别是什么呢?今天我们就来分析一下这两个版本的区别。
1.文件名
2.文件大小
完整版:包含编译器和运行时的版本。
编译器:用于将模板字符串编译成JavaScript渲染函数的代码。
不完整版不含编译器,体积比完整版小30%左右。
3.视角
完整版
视图是用HTML或模板选项编写的。由于编译器的存在,完整版运行时:用于创建Vue实例、渲染和处理虚拟DOM等的代码。基本上,除了编译器之外的所有东西。
不完整版本
完整版运行时:当使用vue-loader或vueify时,*中的模板。vue文件将在构建时预编译成JavaScript。在最终的包中实际上不需要编译器,所以只需要使用运行时版本。
//不需要编译器
新Vue({
渲染(h) {
返回h(div ,this.hi)
}
})
//需要编译器
新Vue({
模板:“div{{ hi }}/div”
})
4.配置
从webpack引入,完整版需要配置别名,不完整版是默认配置;
从@vue/cli引入,完整版需要额外配置,不完整版是默认配置。
总结
既然两者差别这么大,那我们一般用哪个版本呢?
当然,使用不完整版本的原因如下:
1.保证用户体验。用户下载的JS文件更小,但只支持H函数。
2.为了保证开发体验,开发者可以直接在vue文件中编写HTML标签,而不是H函数。
3.让装载机去做。vue-loader会把vue文件中的HTML转换成H函数,这样我就可以做和完整版一样的事情,而不用写太多麻烦的H函数。它还节省了文件大小并改善了用户体验。
以上是边肖介绍的两个版本Vue的区别和用法(为了更深入的理解)。希望对你有帮助!