importmap的cdn不稳定问题处理

先看看项目里面有哪些包。
cat config/importmap.rb
pin "bootstrap", to: "https://ga.jspm.io/npm:bootstrap@5.3.2/dist/js/bootstrap.esm.js"
pin "@popperjs/core", to: "https://ga.jspm.io/npm:@popperjs/core@2.11.8/lib/index.js"

bin/importmap bin bootstrap --download
这个命令好像把importmap.rb里面的其它也download下来了。

pin "bootstrap" # @5.3.3
pin "@popperjs/core", to: "@popperjs--core.js" # @2.11.8

上面的处理方式是有问题的，因为 download下载下来的poperjs--core里面还要调用别的js包，这些本地没有，所以运行的时候还是会有问题。
那正确的方式是

bin/importmap pin @popperjs/core@2.11.8/+esm  --from jsdelivr  --download
mv vendor/javascript/@popperjs--core--+esm.js vendor/javascript/stupid-popper-lib-2024.js

通过 jsdelivr这个源来下载，它会自动把依赖的打包成一个，虽然有点笨重，但是可以用。这里改个名，标注一下。
另外还需要在
#config/initializers/assets.rb 里面添加上
Rails.application.config.assets.precompile += %w( bootstrap.js stupid-popper-lib-2024.js )

编译这2个本地js文件。
最后访问网页的时候可以看到，importmap里面引用的js都来自本地了。

开发环境ok了，在生产环境下，需要上传vendor/javascript 这个目录和下面的文件，要检查.gitignore 和deploy.rb是否屏蔽了这个文件夹或者忽略并建立了这个文件夹的链接。

来自github上的讨论
阅读量: 813
发布于:
修改于: