Javascript 模块在 github 页面上不起作用

Question

我使用本地服务器（使用实时服务器 VS 扩展）构建了一个项目，该项目工作正常。

在这个项目中，我使用 javascript 模块，所以在 index.html 中，我有：

<script src="js/index.js" type="module"></script>

在 index.js 中：

import {} from "/js/home.js";
import {} from "/js/filter.js";
import {} from "/js/scroll.js";

当我尝试使用 github 页显示网站时，问题就来了。 似乎找不到 JS 文件，浏览器控制台返回：

home.js:1 资源加载失败：服务器响应状态为 404() filter.js:1 资源加载失败：服务器响应状态为 404()

我尝试更改路径但没有成功，而且我不知道为什么在本地一切正常但在 github 页面上却不行

Answer 1

也许路径中的点可以帮助您import {} from "./js/home.js";

Answer 2

作为一个相对较新的编码器，我的 JavaScript 模块也遇到了同样的问题。

我的页面在我的本地实时服务器上工作，不会部署在 GitHub 上。

可能是您使用的路径没有指向您的 JS 脚本所在的正确位置。 也许您需要使用正斜杠前面带点的相对路径，例如./而不是/

这样，它指向您的本地存储库文件夹。

我想如果你只是将它设置为正斜杠/ ，它指向你的 GitHub 页面的根目录而不是你的本地存储库。

在我的例子中，我的 web 页面在我更改我的index.html中的脚本源后正确加载：

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

到：

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