我开始理解rails 7中新的导入 map 功能了.看起来使用这个功能有很多好处.
然而，如果我需要一个转换步骤(例如JSX)，我似乎需要一个JSBundle 解决方案.我不清楚这是否意味着我也不能使用导入 map ，或者它的任何好处？
有没有人能帮我理解一下，这些东西能不能同时使用？
我开始理解rails 7中新的导入 map 功能了.看起来使用这个功能有很多好处.
然而，如果我需要一个转换步骤(例如JSX)，我似乎需要一个JSBundle 解决方案.我不清楚这是否意味着我也不能使用导入 map ，或者它的任何好处？
有没有人能帮我理解一下，这些东西能不能同时使用？
Importmaps处理import条语句，esbuild将删除所有导入.在esbuild的基础上再使用importmaps是没有意义的.但是，可以说，您可以并行使用它们.只需创建两个javascript条目文件，一个由esbuild处理，另一个原封不动地与importmaps一起使用.
<%= javascript_importmap_tags "application_importmap" %>
<%= javascript_include_tag "application_esbuild", defer: true %>
如果您在application.js中有import条语句，并且使用esbuild条语句，那么它将把所有的导入平滑到一个文件中，外加转换、编译和您设置的任何其他操作.在那之后没有剩下import条语句，你会得到熟悉的gobbledygook包:
// application.js
(() => {
var __defProp = Object.defineProperty;
var __getOwnPropNames = Object.getOwnPropertyNames;
var __esm = (fn, res) => function __init() {
return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
};
...
如果您使用importmaps，则不会进行任何类型的预处理，并且所有import条语句都保持不变.实际导入委托给浏览器.这是importmaps做工作的地方，application.js和其他文件不受影响:
// application.js
import "@hotwired/turbo-rails";
例如，Importmaps告诉浏览器在哪里可以找到@hotwired/turbo-rails.因为它不是浏览器可以获取的URL，所以必须映射到URL.这就是你做这些大头针的原因.它们负责映射到相对或远程URL.相对URL由sprockets处理，并在文件更改时自动更新.
<script type="importmap" data-turbo-track="reload">{
"imports": {
"@hotwired/turbo-rails": "/assets/turbo-5605bff731621f9ca32b71f5270be7faa9ccb0c7c810187880b97e74175d85e2.js",
"application": "/assets/application-0fe7d3d5e7e66b4e14e543d5e9caa2c8eaabde6653ad2d873c4ddc3dea81f0fd.js"
}
}</script>
如果你的application.js被esbuild处理了，那么importmaps就没有什么可做的了.
也许你可以只移动jsx个，而不碰import个，但这感觉像是设置得有点过头了.
为了简单起见， Select 其中之一:坚持使用基本的Java脚本并使用importmaps，否则使用esbuild.
100