javascript - Webpack 从不同的块导入模块,而不是同一块中可用的最新版本
问题描述
长话短说:我需要能够做这样的事情:
output: {
moduleId: '[name].[contenthash].js',
},
现在是长版:
简而言之:我有 1 个可在所有页面上使用的 JS 文件,以及 1 个特定于我的应用程序每个页面的 JS 文件。到目前为止,还算正常。(例如:一个 global.js 和一个 login.js)
我的应用程序不太正常的方面是这两个文件可能没有同时构建/编译。(这是有原因的,但不值得在这篇文章中讨论)
这就是问题所在:假设两个文件都使用我创建的本地化类。global.js 文件将其导入其块中,而 login.js 文件导入相同的类/模块。现在让我们假设特定的 global.js 文件是在 login.js 之前 1 个月创建的,因此缺少我在处理 login.js 时添加到本地化类的几个方法。
出于某种原因,login.js 块没有使用其自己文件中可用的类,因为似乎某些缓存机制导致它使用 global.js 块中可用的过时类。这会导致 login.js 中的代码调用该类的未定义方法,因为它们在创建 global.js 时并不存在。
在探索条目/块时,我看到包含我提到的类的本地化文件在全局块和登录块中获得相同的键 (786)。这似乎是 Webpack 的缓存机制假设它们都是同一个文件并且只加载它首先找到的文件的原因。
(如果我手动将输出的 login.js 文件中的密钥从 786 更改为随机数,它将按预期开始工作)
我能做些什么来防止这种行为吗?
解决方案
诀窍是创建一个插件,让我决定为模块提供什么 ID。所需的更改显示在下面的提交中。
https://github.com/Jeandcc/webpack-demo/commit/89d8ad1c7b8a0dd1156f3847aa95765b1a1de8a3
该插件只是为模块分配一个 ID,该 ID 是其名称与 buildHash 的组合,这应该有助于区分在不同时间构建的模块。
推荐阅读
- c - 如何避免在函数调用中保留 C 中的字符串值
- sqlite - 在 Android 中获取 SQLite 结果的正确方法
- android - 如何在android中实现实时动态图标,如时钟/日历应用程序?
- javascript - 拦截任何请求 - javascript
- python - 从 Azure Databricks 中的 Azure Datalake Gen2 读取 .nc 文件
- antd - Ant Design 异步树的功能重构返回关键错误
- c++ - 找不到 Boost 静态库:Log_Setup 和 Thread
- xcode - 无法从项目标头 Xcode 11 访问变量或类型
- python - 如果我在 TCP 通信中丢失了数据包,如何将我的客户端重新连接到我的服务器?
- php - Android没有将图像/位图上传到服务器