在浏览器中使用ESModule需用<script type="module">声明，路径须为有效URL（如./math.js或HTTPS地址），模块自动defer执行且具独立作用域，调试时注意解析失败、跨域等报错。
` 运行脚本">
在浏览器原生环境中使用 ESModule 运行脚本，核心是通过 <script type="module"> 声明模块上下文，并确保资源加载符合模块规范。
必须添加 type="module" 属性
普通 <script> 标签默认是传统脚本（script），不支持 import/export；只有显式声明 type="module" 才启用 ES 模块环境：
<script type="module">
import { foo } from './utils.js';
foo();
</script>
注意：即使脚本内容是纯 JS（无 import/export），只要加了 type="module"，它就运行在模块作用域中——意味着变量默认不挂载到 window，且有顶层 await 支持。
模块路径必须是有效 URL（含协议或相对路径）
浏览器对模块导入路径要求严格，不支持裸导入（如 import {x} from 'lodash'），也不支持本地文件系统路径（file:// 协议下多数模块导入会失败）：
立即学习“Java免费学习笔记（深入）”；
Java项目代码review工具。分析Git变更+完整调用链路上下文，推断业务需求，进行多维度评分和分类汇总，生成完整PRD文档。包含细粒度Java代码审查清单（Null安全、异常处理、Streams、并发、equals/hashCode、资源管理、API设计、性能、MyBatis/ORM、事务边界、SQL/DD...
- ✅ 正确：
import './math.js'、import 'https://unpkg.com/lodash-es@4.17.21/index.js' - ❌ 错误：
import 'lodash'（无解析规则）、import '/js/math.js'（若当前页非同源根目录可能 404）
建议统一用相对路径（如 ./ 或 ../ 开头），并确保服务器能正确返回 application/javascript MIME 类型。
模块脚本自动延迟执行，无需手动 defer
type="module" 脚本天然具有 defer 行为：下载异步、执行等待 DOM 解析完成、保持顺序。因此以下写法等效：
<script type="module" src="main.js"></script>
<script type="module">
import { init } from './main.js';
init();
</script>
它们都会在 HTML 解析完毕后按出现顺序执行，且不会阻塞页面渲染。
调试与常见报错提示
遇到问题时，优先检查控制台错误信息：
-
Failed to resolve module specifier→ 导入路径无效或 404，确认路径拼写和服务器路由 -
Importing from a script with type=module is not supported→ 尝试从非模块脚本（普通<script>）里 import，这是禁止的 -
Cross-Origin Request Blocked→ 模块资源跨域且未配CORS头，可换 CDN 或启动本地服务（如npx serve）
开发阶段强烈建议用本地 HTTP 服务启动，避免 file:// 协议限制。
