在Rails 7.1中用ImportMaps引入HighlightJS遇错求解决

问题场景 #

我在Rails 7.1中尝试引入HighlightJS，初始配置如下：

# importmap.rb    
pin "highlightjs", to: "https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"

// application.js
import hljs from "highlightjs"

执行后触发错误：

Uncaught SyntaxError: ambiguous indirect export: default

问题根源 #

最初我执行了错误的pin命令：

bin/importmap pin highlightjs

该命令将包指向了旧版本的非ES模块文件：

Pinning "highlightjs" to https://ga.jspm.io/npm:highlightjs@9.16.2/highlight.pack.js

之后我手动修改importmap指向最新版本，但该CDN文件同样不是ES模块格式，导致错误持续。

正确解决方案 #

执行正确的pin命令，指定正确的包名（highlight.js而非highlightjs）：

bin/importmap pin highlight.js

该命令会自动将包指向符合ES模块规范的最新版本文件：

Pinning "highlight.js" to https://ga.jspm.io/npm:highlight.js@11.9.0/es/index.js

之后在application.js中正常导入即可：

import hljs from "highlight.js"
// 可选：添加初始化代码启用高亮
// hljs.highlightAll();

内容的提问来源于stack exchange，提问作者Will