VS Code Live Server与Mousepad打开同页面时Script执行结果不一致

问题根因 #

该执行差异与VS Code修改源代码无关，由两种加载场景的执行时机、控制台上下文差异导致，常见原因如下：

• 命令执行时机早于脚本加载完成时间：Live Server启动后会自动跳转打开页面，如果你在页面DOM、内置脚本完全解析执行完成前就输入了调用output的控制台命令，此时output函数还未注册到全局作用域，就会抛出未定义错误。而通过本地文件打开时，浏览器会加载完整个文件内容再完成渲染，你操作控制台时脚本已经执行完毕，所以可以正常调用output函数。
• 控制台上下文选择错误：如果浏览器控制台的上下文选择为Live Server自动注入的重载脚本上下文，而非顶层页面的top上下文，也会找不到你定义在顶层全局作用域的output函数，你可以在控制台顶部的上下文选择器切换为top后重试。
• Live Server注入脚本异常打断执行：特殊情况下如果Live Server注入的自动重载脚本存在语法错误，会中断后续你自定义的<script>块的执行，导致output函数没有完成注册，你可以右键查看页面源码，确认自定义的脚本内容和本地文件一致即可排除VS Code修改代码的可能。

验证方案 #

在自定义<script>块的末尾添加一行日志：

console.log('自定义脚本执行完成, output函数类型：', typeof output)

重新通过Live Server打开页面，等待控制台打印上述日志后，再执行调用output的命令即可正常运行。

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