vue的各个版本,vuecli版本区别

vue的各个版本,vuecli版本区别,Vue两个版本的区别和使用方法(更深层次了解)

我们在使用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的区别和用法(为了更深入的理解)。希望对你有帮助!

vue的各个版本,vuecli版本区别