esmodule 可直接通过 cdn 在浏览器中运行，需 script 标签添加 type="module"；可借助 skypack 或 jsdelivr 提供 esm 入口，注意匹配包的导出方式（命名/默认），且模块脚本异步加载、顺序执行、作用域隔离。

ESModule 可以直接配合 CDN 使用，关键在于让浏览器识别模块语法，并指向支持 ESM 的资源地址。不需要构建工具，纯前端就能跑起来。

必须加 type="module"

普通 script 标签默认不是模块环境，必须显式声明：

• 在 script 标签上添加 type="module"
• 否则 import/export 会报错："Cannot use import statement outside a module"
• 即使代码里只写 import，也必须设这个属性

用 Skypack 或 JSDelivr 提供 ESM 入口

不是所有 npm 包都自带浏览器可用的 ESM 文件。Skypack 和 JSDelivr 能自动转换 CommonJS 等格式为标准 ESM：

Java Maven Code Review

审查Java Maven项目（ZIP压缩包或GitLab仓库URL），检查代码规范、命名、模块边界、可维护性问题以及重复代码。

下载

• Skypack：直接写包名，它帮你转成 ESM 地址
  import { marked } from 'https://cdn.skypack.dev/marked@14'
• JSDelivr：需指定 ESM 路径（如 marked 的 /lib/marked.esm.js）
  import { marked } from 'https://cdn.jsdelivr.net/npm/marked@14/lib/marked.esm.js'
• 两者都支持版本号锁定，避免意外升级破坏功能

注意路径和导出方式匹配

导入语句要和包的实际导出结构一致：

• 如果包导出的是命名导出（如 export { parse, setOptions }），就用 import { parse } from ...
• 如果包是默认导出（export default xxx），就用 import marked from ...
• Marked.js 14+ 版本同时支持两种，但推荐用命名导入，更清晰、利于 tree-shaking

加载顺序与执行时机

ESM 是异步加载、严格顺序执行的，要注意：

• 模块脚本自动延迟执行（等 DOM 解析完才运行），不用再写 DOMContentLoaded
• 多个 type="module" 脚本按 HTML 中出现顺序串行执行
• 不能在非模块 script 中访问模块内定义的变量（作用域隔离）
• 如果要操作 DOM，确保目标元素已存在，或把逻辑放在模块顶层（此时 DOM 已就绪）

Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南