浏览器如何直接在Vite的index.html中使用typescript文件？

Question

最近在玩Vite。让我感兴趣的一件事是它能够直接在 index.html 中使用 typescript 文件，例如

<script type="module" src="/src/main.ts"></script>

从文档中，我了解到 Vite 会将原始代码从 Typescript 转换为 Javascript（我检查了内容main.ts确实已转换）。但是浏览器如何运行文件中的 Javascript 代码呢*.ts？

我尝试通过创建一个简单的静态服务器来复制它，其中index.html包含上面的脚本标签。然而，浏览器会抛出错误：

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "video/mp2t". Strict MIME type checking is enforced for module scripts per HTML spec.

那么 Vite 怎么可能做到这一点呢？

Answer 1

但是浏览器如何运行 *.ts 文件中的 Javascript 代码呢？

JavaScript 不在*.ts文件中。

它是一个带有Content-Type: text/javascript响应标头的资源，可通过 URL 进行检索。该 URL 的路径仅在它告诉服务器要查找的内容时才重要。浏览器并不关心其中包含什么字母。