在 GitHub 页面上托管下一个应用程序时，js 和 css 未加载

Question

Next.js 在 _next 文件夹中构建所有静态资产，但 Github 页面不需要提供这些文件。我是静态资源404

示例回购：https://github.com/ajaymathur/ajaymathur.github.io master 分支托管，dev 分支用于开发。

而且我猜想 github 页面没有承载以 - 开头的路径。我该如何解决这个问题？

Answer 1

Add a .nojekyll file 在包含 _next 文件夹的文件夹中。

这会禁用 Jekyll 处理并让 _next 文件夹（包含下划线）复制到最终网站。

我的 _next 文件夹在我的存储库的根目录中，所以我在根目录中添加了一个 .nojekyll 文件。

Answer 2

仅添加 .nojekyll 文件对我来说还不够。我不得不更改构建命令以在 导出到静态 HTML/CSS/JS 之后添加文件 像这样

  "scripts": {
    ...
    "static": "next build && next export && touch ./out/.nojekyll && echo 'www.mywebsite.com' > ./out/CNAME",
    ...
  },

我还使用 gh-pages 将文件从 out 文件夹复制到分支 Github 将提供页面，默认情况下 .nojekyll 文件未被复制超过。这可以通过将 -t 选项设置为 true

来规避

  "scripts": {
    ...
    "deploy": "gh-pages -d out -t true"
    ...
  },

进行这些更改后，npm run static && npm run deploy 应该可以满足您的需求。