由于 MIME 类型不允许，无法加载模块脚本

Question

考虑以下文件结构和内容：

\n\n

js\n\xe2\x94\x94\xe2\x94\x80 test\n    \xe2\x94\x9c\xe2\x94\x80 modules\n    \xe2\x94\x82  \xe2\x94\x94\xe2\x94\x80 math.mjs\n    \xe2\x94\x94\xe2\x94\x80 main.mjs\n

\n\n

_{数学.mjs：}

\n\n

export function square(v) { return v * v; }\n

\n\n

_{主要.mjs：}

\n\n

import { square } from \'./modules/math.mjs\';\nconsole.log(square(2));\n

\n\n

---

\n\n

在（通过 Apache Web 服务器）的一个简单页面上http://server.local/module-test，我尝试加载main.mjs：

\n\n

<script type="module" src="http://server.local/js/test/main.mjs"></script>\n

\n\n

但浏览器不断抱怨 MIME 类型，例如：

\n\n

\n

无法加载模块脚本：服务器响应非 JavaScript MIME 类型“”。根据 HTML 规范对模块脚本强制执行严格的 MIME 类型检查。

\n

\n\n

我已经在声明中尝试了其他相对引用（通过/、./和../），import但没有成功！

\n\n

那么，我错过了什么让它发挥作用呢？

\n

Answer 1

浏览器加载模块的条件之一是服务器为该模块提供 MIME 类型application/javascript（或其他适当的 MIME 类型，具体取决于语言和浏览器支持；有一种新类型的javascript/esmJavaScript 模块具有混合支持） 。这意味着配置服务器提供至少包含Content-Type: application/javascriptjavascript 模块（或一般 javascript）的响应标头。

从您收到的错误来看，您的服务器似乎提供了空Content-Type标头或根本不提供标头。当尝试从 url 加载模块file://而不使用服务器时，通常会发生这种情况，但如果服务器配置错误，也可能会发生这种情况。

.mjs服务器可能无法识别文件扩展名，因此无法使用正确的 MIME 类型提供服务。