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

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

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

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

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

为什么会有这种区分呢?

  • 第一,因为Vue使用/运行过程分为两个阶段,第一阶段是将模版进行编译(如单个vue文件中的template)为渲染函数(render),第二阶段是将实际函数的调用阶段。
  • 第二,因为自Vue2.x开始,Vue开始支持SSR(服务端渲染),而服务端是没有DOM这些概念的。所以导致了从Vue2.x后会有分包的问题。

下面是官方话术:

  1. 独立构建包括编译和支持 template 选项。 它也依赖于浏览器的接口的存在,所以你不能使用它来为服务器端渲染。
  2. 运行时构建不包括模板编译,不支持 template 选项。运行时构建,可以用 render 选项,但它只在单文件组件中起作用,因为单文件组件的模板是在构建时预编译到 render 函数中,运行时构建只有独立构建大小的 30%,只有 16Kb min+gzip 大小。

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

  1. 独立构建包括编译和支持 template 选项
  2. 运行时构建不包括模板编译,不支持 template 选项

Vue2的独立构建与运行时构建的差别的更多相关文章

  1. 通过Dapr实现一个简单的基于.net的微服务电商系统(十三)——istio+dapr构建多运行时服务网格之生产环境部署

    之前所有的演示都是在docker for windows上进行部署的,没有真正模拟生产环境,今天我们模拟真实环境在公有云上用linux操作如何实现istio+dapr+电商demo的部署. 目录:一. ...

  2. Jmeter+ant+Jenkins构建接口自动化测试时构建失败 提示:Fatal Error! 字符引用 "&#原因

    Jmeter+ant+Jenkins构建接口自动化测试时构建失败 提示:Fatal Error! 字符引用 "&#原因:接口响应数据中有&#

  3. 通过Dapr实现一个简单的基于.net的微服务电商系统(十二)——istio+dapr构建多运行时服务网格

    多运行时是一个非常新的概念.在 2020 年,Bilgin Ibryam 提出了 Multi-Runtime(多运行时)的理念,对基于 Sidecar 模式的各种产品形态进行了实践总结和理论升华.那到 ...

  4. vue独立构建和运行构建

    有两种构建方式,独立构建和运行构建.它们的区别在于前者包含模板编译器而后者不包含. 模板编译器:模板编译器的职责是将模板字符串编译为纯 JavaScript 的渲染函数.如果你想要在组件中使用 tem ...

  5. 正确理解java编译时,运行时以及构建时这三个概念

    Java中的许多对象(一般都是具有父子类关系的父类对象)在运行时都会出现两种类型:编译时类型和运行时类型,例如:Person person = new Student();这行代码将会生成一个pers ...

  6. oc的运行时系统

    Objective-C is a class-based object system. Each object is an instance of some class; the object's i ...

  7. 在运行时生成C# .NET类

    ​本文译自​:​Generating C# .NET Classes at Runtime 作者:WedPort 在我的C#职业生涯中,有几次我不得不在运行时生成新的类型.希望把它写下来能帮助有相同应 ...

  8. 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(6)-Unity 2.x依赖注入by运行时注入[附源码]

    原文:构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(6)-Unity 2.x依赖注入by运行时注入[附源码] Unity 2.x依赖注入(控制反转)IOC,对 ...

  9. LINQ to SQL 运行时动态构建查询条件

    在进行数据查询时,经常碰到需要动态构建查询条件.使用LINQ实现这个需求可能会比以前拼接SQL语句更麻烦一些.本文介绍了3种运行时动态构建查询条件的方法.本文中的例子最终实现的都是同一个功能,从Nor ...

随机推荐

  1. JDBC概述

    什么是持久化(persistence):持久化(persistence):把数据保存到可掉电式存储设备中以供之后使用.大多数情况下,特别是企业级应用,数据持久化意味着将内存中的数据保存到硬盘上加以”固 ...

  2. mysql 数据库(二)数据库的基本操作

    mysql 数据库(二)数据库的基本操作 用户管理,添加权限,创建,显示,使用数据库 1 显示数据库:show databases; 默认数据库: mysql - 用户权限相关数据 test - 用于 ...

  3. SpringBoot启动banner更改

    这篇文章的开始先给大家看一个图片 用过或者看过springboot的人都知道,这就是springboot启动的banner,这一篇介绍如何自定义springboot的启动bannner. 先介绍一个可 ...

  4. 潭州课堂25班:Ph201805201 第一课:环境搭建 (课堂笔记)

    安装PyCharm ,Oracle VM VirtualBox,Xshell ,实现仿真远程连接服务器,其中Oracle VM VirtualBox用于那家linux服务器,Xshell 用于连接服务 ...

  5. [CC-COUPLES]Couples sit next to each other

    [CC-COUPLES]Couples sit next to each other 题目大意: 有\(n(n\le5\times10^5)\)对小伙伴共\(2n\)个人坐成一圈.刚开始编号为\(i\ ...

  6. 如何使用单例模式返回一个安全的Connection

    import java.sql.Connection; import java.sql.DriverManager; import java.sql.SQLException; public clas ...

  7. java基础知识总结--继承和接口

    什么是继承?什么是接口?他们之间的区别和联系是什么? 什么是继承? 继承是使用已存在的类的定义作为基础建立新类的技术,新类的定义可以增加新的数据或新的功能,也可以用父类的功能.多个类中存在相同属性和行 ...

  8. HDU 5961 传递 随机化

    传递 题目连接: http://acm.hdu.edu.cn/showproblem.php?pid=5961 Description 我们称一个有向图G是传递的,当且仅当对任意三个不同的顶点a,,若 ...

  9. Python中将array类型不按科学计数法存在文件中的方法

    直接上代码: from numpy import *import numpy as npDrug_array = zeros((708,708),dtype = int)f = open('D:\ma ...

  10. mac 本地跨域

    完全退出chrome后终端下输入以下命令: chrome49以前版本 open -a "Google Chrome" --args --disable-web-security c ...