其实这个问题在你使用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. Typescript 常见的几种函数重载方法详解与应用示例

    所谓的重载,其实就是使用相同的函数名,传入不同数量的参数或不同类型的参数,以此创建出多个方法或产生不同结果. 1. 最常见的,也就是根据定义傻瓜式地判断参数类型与数量 function showPer ...

  2. 如何基于asp.net core的Identity框架在mysql上作身份验证处理

    首先了解这个概念,我一开始也是理解和掌握基本的概念,再去做程序的开发.Identity框架是微软自己提供,基于.net core平台,可拓展.轻量 级.面向多个数据库的身份验证框架.IdentityS ...

  3. 关闭VS2015的WPF UI调试工具

    VS菜单: 工具 > 选项 > 调试 > 常规 > 启用Xaml 的UI调试工具.把勾勾去掉.

  4. 机器学习系列-tensorflow-02-基本操作运算

    tensorflow常数操作 import tensorflow as tf # 定义两个常数,a和b a = tf.constant(2) b = tf.constant(3) # 执行默认图运算 ...

  5. 如何去掉linux配置文件的注释行和空行

    1.使用grep -v "^#"  来去掉注释行,其中:-v  就是取相反的   ^# 表示以#开头的行 eg. grep -v "^#" /etc/vsftp ...

  6. yum与rpm的区别以及详细介绍

    rpm是由红帽公司开发的软件包管理方式,使用rpm我们可以方便的进行软件的安装.查询.卸载.升级等工作.但是rpm软件包之间的依赖性问题往往会很繁琐,尤其是软件由多个rpm包组成时. Yum(全称为 ...

  7. mongoDB,mongoose,没有数组就添加,如果有了数组,就向数组中添加新元素

    db.getCollection('photos').findOneAndUpdate("5b028e71f32bd5004f905879",   //findByIdAndUpd ...

  8. Eclipse Maven pom.xml 警告No grammar constraints (DTD or XML schema)

    消除警告方案: <?xml version="1.0" encoding="UTF-8" standalone="no"?> & ...

  9. R图表入门

    R图表入门 R语言最强的功能就是统计和作图了,在学习了基本语法之后,博主马上体验了一下R的图表功能 条形图 例1 H = c(7,12,28,3,41) M = c("Mar",& ...

  10. 学习 IOC 设计模式前必读:依赖注入的三种实现

    一直以来就是越难的东西越值钱! 嘿嘿,这篇博文章转载自:http://www.cnblogs.com/liuhaorain/p/3747470.html 摘要 面向对象设计(OOD)有助于我们开发出高 ...