在HTML中导入JS文件作为模块时Firefox浏览器出现CORS错误

这个报错是浏览器同源策略限制导致的：ES 模块的加载要求必须遵循 HTTP(s) 协议的跨域规则，直接用file://协议打开本地 HTML 文件时，浏览器会判定跨域，禁止加载外部模块文件。

方案一：启动本地 HTTP 服务器（推荐） #

这是最通用、和生产环境行为一致的方案，只需要在项目根目录启动一个简易 HTTP 服务器，再通过http://localhost访问页面即可：

• 如果你本地安装了 Python3，在项目根目录打开终端执行命令：
  python -m http.server 8000
  执行完成后在浏览器访问 http://localhost:8000 即可打开页面
• 如果你本地安装了 Node.js，可直接执行命令启动服务：
  npx serve
  或者安装http-server工具后执行：
  npx http-server
• 如果你使用 VS Code 编辑器，可直接搜索安装「Live Server」插件，右键点击 HTML 文件选择「Open with Live Server」即可一键启动服务并打开页面

方案二：修改 Firefox 配置（仅临时调试用，不推荐长期开启） #

如果只是临时调试，可以修改 Firefox 本地文件的同源策略限制，注意调试完成后建议改回默认配置，避免带来安全风险：

1. 在 Firefox 地址栏输入 about:config 回车，点击确认接受风险提示
2. 在搜索框输入 security.fileuri.strict_origin_policy，双击该项将布尔值修改为 false
3. 重新打开本地 HTML 文件即可正常加载模块

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