VSCode调试本地JavaScript时因CORS无法加载外部脚本的解决方案咨询

--allow-file-access-from-files启动参数方案完全可行，仅用于本地调试自有代码的场景下不存在额外安全风险：

• 优势：配置成本极低，无需安装任何额外工具或插件，仅修改launch.json即可完成适配
• 注意事项：该模式会降低Chrome的本地文件安全限制，请勿在该模式启动的Chrome实例下访问任意外部公网网站，调试结束后直接关闭对应浏览器实例即可。

修改后的launch.json参考配置如下：

{
    // Use IntelliSense to learn about possible attributes.
    // Hover to view descriptions of existing attributes.
    "version": "0.2.0",
    "configurations": [
        {
            "type": "chrome",
            "request": "launch",
            "name": "Launch Chrome from the file system",
            "file": "${workspaceFolder}/src/index.html",
            "runtimeArgs": ["--allow-file-access-from-files"]
        }
    ]
}

如果不希望修改浏览器安全策略，可选择以下零配置/轻配置的替代方案，都不需要手动搭建复杂的外部服务：

• 方案1：安装VS Code的Live Server扩展
  安装完成后右键点击index.html选择「Open with Live Server」即可自动启动本地HTTP服务器，所有资源请求都会走HTTP协议，天然不存在file协议的CORS问题，同时修改代码会自动刷新页面，调试体验更好。如果需要关联VS Code的调试能力，把launch.json中的file字段替换为Live Server默认的本地访问地址即可，示例："url": "http://127.0.0.1:5500/src/index.html"。
• 方案2：使用Node.js单行命令启动临时服务
  只要本地有Node.js环境，无需全局安装任何工具，直接在项目根目录执行命令npx serve即可启动本地HTTP服务，默认端口3000，同样可以规避file协议的CORS限制。
• 方案3：使用Firefox浏览器调试
  Firefox默认对本地file协议的ES模块加载限制更宽松，直接用file协议打开本地HTML文件不会触发上述CORS报错，无需修改任何配置即可直接调试。

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