💡
原文中文，约3000字，阅读约需7分钟。
📝
内容提要
本文探讨了在 Rails 7 中结合使用 Importmap 和 jsbundling，以解决 Importmap 无法处理复杂 JavaScript 依赖的问题。通过使用 esbuild 打包依赖并利用 Importmap 导入，可以有效管理和优化 JavaScript 代码的加载，尽管这可能会影响无构建的期望，但仍能享受细粒度缓存的优势。
🎯
关键要点
- 从 Rails 7 开始，Importmap 成为处理 JavaScript 加载的默认机制，利用 HTTP/2 的并行下载和缓存机制。
- Importmap 提供 pin 功能，可以从 CDN 下载 JavaScript 文件并自动配置，但对于某些库可能会遇到依赖问题。
- 使用 jsbundling 将依赖打包后，再用 importmap 导入，可以有效解决复杂依赖的问题。
- 实现步骤包括安装 jsbundling、修改配置文件、创建必要的文件夹和文件，并通过 yarn 安装依赖。
- 最终，esbuild 将源码编译并处理，允许在 JavaScript 中正常导入复杂依赖。
❓
延伸问答
什么是 Importmap，它在 Rails 7 中的作用是什么？
Importmap 是 Rails 7 中处理 JavaScript 加载的默认机制，利用 HTTP/2 的并行下载和缓存机制，优化代码加载。
Importmap 在处理某些 JavaScript 库时会遇到什么问题？
Importmap 在处理某些库时可能会遇到依赖问题，尤其是当库没有将源码打包成完整包时，可能导致导入不完整。
如何使用 jsbundling 解决 Importmap 的复杂依赖问题？
可以先使用 jsbundling 将依赖打包，然后再用 Importmap 导入，以有效解决复杂依赖的问题。
使用 jsbundling 的具体实现步骤是什么？
实现步骤包括安装 jsbundling、修改配置文件、创建必要的文件夹和文件，并通过 yarn 安装依赖。
结合使用 esbuild 和 Importmap 的优点是什么？
结合使用 esbuild 和 Importmap 可以解决 Importmap 无法处理复杂依赖的问题，同时享受细粒度缓存的优势。
在使用 Importmap 时，如何处理未下载的可选模块？
如果下载所有可选模块，Importmap 配置会膨胀，因此建议使用 jsbundling 先打包依赖，再通过 Importmap 导入。
➡️
