【问题标题】:What is actually "Rule.type" in webpack?webpack 中的“Rule.type”实际上是什么?
【发布时间】:2022-12-16 09:51:23
【问题描述】:

我很难理解the docs给出的解释:

Rule.type 设置匹配模块的类型。这可以防止 defaultRules 及其默认导入行为不会发生。为了 例如,如果你想通过自定义加载器加载一个.json文件, 你需要将 type 设置为 javascript/auto 以绕过 webpack 的 内置 json 导入。

如果我理解正确,Rule.type 的目的是覆盖 defaultRules(无论它们是什么,我在任何地方都找不到关于它们的任何信息)。但这没有意义,因为:

  1. 有一个类型,json,我认为应该用于.json文件,而不是javascript/auto。如果目的是覆盖默认规则,那么创建和使用 overrideDefaultRules 布尔字段而不是指定错误的类型不是更好吗?
  2. 我们要覆盖的那些默认规则是什么?

    Asset Modules 的文档中,据说......

    Asset Modules 类型通过添加 4 个新模块类型替换了所有这些加载器:

    • 资产/资源发出一个单独的文件并导出 URL。以前可以通过使用文件加载器实现。
    • asset/inline 导出资产的数据 URI。以前可以通过使用 url-loader 实现。
    • asset/source 导出资产的源代码。以前可以通过使用 raw-loader 实现。
    • 资产在导出数据 URI 之间自动选择 并发出一个单独的文件。以前可以通过使用实现 具有资产大小限制的 url-loader。

    使用旧的资产加载器时(即 file-loader/url-loader/raw-loader) 以及 webpack 中的资产模块 5、你可能想要停止 Asset Module 处理你的资产 再次因为这会导致资产重复。这可以通过 将资产的模块类型设置为“javascript/auto”。

    如果这个新资产模块的全部意义在于做加载器所做的事情,那么为什么有人会像最后一段所暗示的那样同时使用资产模块和加载器?而且...如果我们不使用“javascript/auto”hack 而不是首先不包含 Aset 模块,那不是更好吗?对于资产的特定情况,它看起来不像,类型的全部意义在于做与加载程序完全相同的事情,但使用 type 字段代替?您可以指定 asset 类型,让它自动在 asset/resourceasset/inline 之间进行选择,但是话又说回来,其他类型实际上会增加什么值呢?我错过了什么? type 是否还有其他未在文档或其他内容中指定的内容?

【问题讨论】:

    标签: webpack


    【解决方案1】:

    如果您浏览源代码,您会发现 webpack 将您的配置 (module.rules) 与其自己的“module.rules”合并,webpack 将其称为默认规则 - defaultRules。

    JSON在这些规则之一中使用 json Rule.type 定义。 Rule.types 是资产模块用来处理不同文件类型(就像加载程序)的预定义内部标记/类型。如文档中所述,其中有一些类型:

    'javascript/自动' | 'javascript/动态' | 'javascript/esm' | 'json' | 'webassembly/同步' | 'webassembly/异步' | '资产' | '资产/来源' | '资产/资源' | '资产/内联'

    'javascript/auto' 类型只是一种特殊类型,用于指示 webpack 在该特定文件类型的“默认设置”中跳过合并,在本例中为 json。

    至于为什么有人会同时使用加载器和资产模块,我不知道,也许是作为迁移旧项目的一部分。

    【讨论】:

      猜你喜欢
      • 2022-01-05
      • 2021-05-12
      • 2011-08-01
      • 2011-12-26
      • 1970-01-01
      • 2017-03-16
      • 2011-03-11
      • 2010-11-26
      • 2015-06-23
      相关资源
      最近更新 更多