基于Vue2的独立构建与运行时构建的差别(详解)


Posted in Javascript onDecember 06, 2017

其实这个问题在你使用vue-cli构建项目的时候是不会出现的,因为你在创建项目的构建过程中已经让你勾选了,然后会写入webpack.config.js中。

基于Vue2的独立构建与运行时构建的差别(详解)

这就在这,会让你选择Vue的构建方式。

基于Vue2的独立构建与运行时构建的差别(详解)

如果你勾选Runtime + Compiler就会出现如上的配置。

其实这里涉及到一个概念:

独立构建:含义是,拥有完整的模版编译功能运行时调用功能

运行时构建:含义是,只拥有完整的运行时调用功能

基于Vue2的独立构建与运行时构建的差别(详解)

为什么会有这种区分呢?

第一,因为Vue使用/运行过程分为两个阶段,第一阶段是将模版进行编译(如单个vue文件中的template)为渲染函数(render),第二阶段是将实际函数的调用阶段。

第二,因为自Vue2.x开始,Vue开始支持SSR(服务端渲染),而服务端是没有DOM这些概念的。所以导致了从Vue2.x后会有分包的问题。

下面是官方话术:

独立构建包括编译和支持 template 选项。 它也依赖于浏览器的接口的存在,所以你不能使用它来为服务器端渲染。

运行时构建不包括模板编译,不支持 template 选项。运行时构建,可以用 render 选项,但它只在单文件组件中起作用,因为单文件组件的模板是在构建时预编译到 render 函数中,运行时构建只有独立构建大小的 30%,只有 16Kb min+gzip 大小。

所以两者最大的区别也就出来了

独立构建包括编译和支持 template 选项

运行时构建不包括模板编译,不支持 template 选项

以上这篇基于Vue2的独立构建与运行时构建的差别(详解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
ExtJS 设置级联菜单的默认值
Jun 13 Javascript
用JSON做数据传输格式中的一些问题总结
Dec 21 Javascript
javascript实现存储hmtl字符串示例
Apr 25 Javascript
JQuery插入DOM节点的方法
Jun 11 Javascript
javascript实现的淘宝旅行通用日历组件用法实例
Aug 03 Javascript
基于JavaScript如何实现私有成员的语法特征及私有成员的实现方式
Oct 28 Javascript
利用jQuery的动画函数animate实现豌豆发射效果
Aug 28 Javascript
AngularJS 模块化详解及实例代码
Sep 14 Javascript
jQuery插件echarts实现的去掉X轴、Y轴和网格线效果示例【附demo源码下载】
Mar 04 Javascript
jQuery 中msgTips 顶部弹窗效果实现代码
Aug 14 jQuery
React 项目迁移 Webpack Babel7的实现
Sep 12 Javascript
javascript canvas时钟模拟器
Jul 13 Javascript
js 两数组去除重复数值的实例
Dec 06 #Javascript
js 提取某()特殊字符串长度的实例
Dec 06 #Javascript
React-Router如何进行页面权限管理的方法
Dec 06 #Javascript
移动前端图片压缩上传的实例
Dec 06 #Javascript
详细分析JS函数去抖和节流
Dec 05 #Javascript
微信小程序实现点击按钮修改字体颜色功能【附demo源码下载】
Dec 05 #Javascript
微信小程序实现动态改变view标签宽度和高度的方法【附demo源码下载】
Dec 05 #Javascript
You might like
解析在PHP中使用mysqli扩展库对mysql的操作
2013/07/03 PHP
Codeigniter中禁止A Database Error Occurred错误提示的方法
2014/06/12 PHP
Laravel 5框架学习之路由、控制器和视图简介
2015/04/07 PHP
46 个非常有用的 PHP 代码片段
2016/02/16 PHP
PHP对象克隆clone用法示例
2016/09/28 PHP
几个常用的JavaScript字符串处理函数 - split()、join()、substring()和indexOf()
2009/06/02 Javascript
一个简单的javascript类定义例子
2009/09/12 Javascript
写出更好的JavaScript之undefined篇(上)
2009/11/22 Javascript
JQUERY操作JSON实例代码
2010/02/09 Javascript
优化RequireJS项目的相关技巧总结
2015/07/01 Javascript
如何使用Bootstrap创建表单
2017/03/29 Javascript
JS正则获取HTML元素的方法
2017/03/31 Javascript
nodejs操作mysql实现增删改查的实例
2017/05/28 NodeJs
Vue组件之极简的地址选择器的实现
2018/05/31 Javascript
vue项目设置scrollTop不起作用(总结)
2018/12/21 Javascript
一步快速解决微信小程序中textarea层级太高遮挡其他组件
2019/03/04 Javascript
微信小程序云开发详细教程
2019/05/16 Javascript
在vue中使用vant TreeSelect分类选择组件操作
2020/11/02 Javascript
删除目录下相同文件的python代码(逐级优化)
2012/05/25 Python
python使用Queue在多个子进程间交换数据的方法
2015/04/18 Python
python抓取百度首页的方法
2015/05/19 Python
对Python3.x版本print函数左右对齐详解
2018/12/22 Python
Python异常处理知识点总结
2019/02/18 Python
bluepy 一款python封装的BLE利器简单介绍
2019/06/25 Python
Python多线程爬取豆瓣影评API接口
2019/10/22 Python
Django中文件上传和文件访问微项目的方法
2020/04/27 Python
Python pip使用超时问题解决方案
2020/08/03 Python
利用CSS3实现动态的二级三级菜单效果实例源码
2017/01/04 HTML / CSS
极简鞋类,赤脚的感觉:Lems Shoes
2019/08/06 全球购物
生物技术研究生自荐信
2013/11/12 职场文书
英语生日邀请函
2014/01/23 职场文书
副职竞争上岗演讲稿
2014/05/12 职场文书
医务人员岗前培训心得体会
2016/01/08 职场文书
优秀党员先进事迹材料2016
2016/02/29 职场文书
预备党员入党思想汇报(范文)
2019/08/14 职场文书
Vue2.0搭建脚手架
2022/03/13 Vue.js