如果连接脚本，则不会触发 Angular DOMContentLoaded

Question

angular prod build 后有几个脚本：(runtime-es6, polyfills-es6, scripts, main-es6)。我将它们连接成一个脚本而不是 4 个，然后像这样将它插入到我的 index.html 中：

<script src="inject-es2015.js" type="module"></script>

似乎没有触发来自 main.ts 的代码，其中定义了 document.addEventListener('DOMContentLoaded'...。

对此的典型回答是“这是因为 DOMContentLoaded 事件在此代码执行时已被触发”。

我的问题为什么？当我简单地连接这些 JS 文件时，发生了什么变化？

我做了一个研究，我完全糊涂了。 Documentation 表示如果 document.readyState === 'interactive' 已经触发了 DOMContentLoaded。我为测试所做的是在 console.log 中添加 main.ts 以查看订阅执行前的状态。 当 index.html 包含所有脚本文件时，我使用默认构建行为进行了测试

在我看到的浏览器中

readyState 是“交互式的”。这个事件怎么可能被触发？ （当我使用连接文件进行测试时，readyState 是相同的）

我可以将 main.ts 中的代码替换为

document.readyState !== 'loading' ? bootstrap() : document.addEventListener('DOMContentLoaded', bootstrap);

这会奏效。但我想了解为什么我必须这样做？