github-pages: ENOENT: 没有这样的文件或目录，stat '* 分机'

Question

我想在 GitHub 上部署我的 Next.js 项目并安装

gh-pages

到我的 Next.js 项目，基于 https://blog.logrocket.com/8-ways-deploy-react-app-free/# github-pages，使用

npm install --save gh-pages

但是之后

npm run deploy

项目构建成功，但是使用这两个命令

[email protected] deploy
gh-pages -d build

出现这个错误：

ENOENT: no such file or directory, stat 'project-path\breeze-next\build'

我该如何解决这个问题？

Answer 1

您正在使用 Next.js 并尝试使用 gh-pages 包将您的应用程序部署到 GitHub Pages。默认情况下，gh-pages 包会在项目的根目录中查找“build”文件夹，但由于 Next.js 使用不同的文件夹名称作为构建输出（默认为“.next”），因此您需要指定自定义构建目录以与 gh-pages 一起使用。

为此，您可以将“distDir”配置添加到 Next.js 项目的“next.config.js”文件中。这将告诉 Next.js 为构建输出使用不同的目录。在您的情况下，您可以将其设置为“构建”以匹配 gh-pages 查找的默认目录。

这是您的“next.config.js”文件的示例：

// next.config.js

module.exports = {
  distDir: 'build',
}

注意！

** 但 GitHub Pages 提供了一种使用 GitHub Actions 将 Next.js 应用程序部署到 GitHub Pages 站点的简单方法。

以下是您可以遵循的步骤：

1. 转到您的 Next.js 应用程序所在的存储库。
2. 单击“设置”选项卡。
3. 在左栏中，选择“页面”选项卡。
4. 在“来源”部分下，选择“GitHub 操作”。
5. 点击“保存”按钮。
6. GitHub 会自动为你创建工作流文件。你不需要 对此文件进行任何更改，因此您可以将其提交给您的 存储库。
7. 等待构建和部署过程完成。这可能需要一些 分钟。
8. 部署完成后，您应该能够看到您的 Next.js 托管在 GitHub Pages URL 上的应用程序。

使用此方法，您无需在 Next.js 项目中安装任何其他包或配置任何设置。 GitHub Pages 将负责为您构建和部署您的应用程序。