部署到 GitHub Pages

GitHub Pages 是一个流行的静态网站托管选项。可以在 <your-repo> > Settings > Pages 中配置 GitHub Pages。

构建配置

GitHub Pages 提供了一些构建选项：

• GitHub Actions
• 从分支部署

Figure: GitHub Actions

我们希望选择 "GitHub Actions"，以便我们可以控制构建脚本，并确保它也在构建 TinaCMS 管理界面。

通过点击为我们创建的操作中的“Configure”，我们可以调整构建脚本以同时构建 tinacms 和我们的网站。

在你的网站构建步骤之前添加以下步骤：

如果你使用 npm 作为包管理器，可以使用以下内容：

或者如果你使用 yarn：

你的 GitHub Action 看起来会像这样：

Figure: GitHub Action

常见问题

常见问题：'Missing script: "tinacms"'

此错误可能由以下原因引起：

1. tinacms 依赖项未添加到 package.json。

确保 tinacms 和 @tinacms/cli 依赖项都列在你的 package.json 中。

2. 依赖项未在 CI 中安装。

如果你使用 npm，确保在 TinaCMS 构建命令之前运行 npm ci。如果你使用 yarn，确保在运行构建命令之前运行 yarn install --frozen-lockfile。

3. 需要定义一个 'tinacms' 脚本。

如果你的 CI 运行的是类似 yarn tinacms build 而不是 npx tinacms build，你需要在你的 package.json 中添加一个自定义脚本：

常见问题：/admin 返回 404

这可能由多种原因引起，但以下是最常见的原因和解决方法：

1. 未提供自定义构建工作流

如果你的网站使用 GitHub Pages 部署，可能正在使用 GitHub 的默认构建步骤。在这种情况下，TinaCMS 不会包含在构建中。

。

要解决此问题，你需要选择 "GitHub Actions" 源，并同时构建 tinacms 管理界面和你的网站。你可以查看我们上面的文档以获取设置此 GitHub Action 的帮助。

2. 'tinacms build' 未在 CI 中运行

检查以确保构建命令正在运行且没有失败

注意：如果你使用 hugo 的 github pages 设置，你需要确保在你的仓库根目录中存在一个 package-lock.json。

常见问题：根 URL 返回 404

这通常是由于缺少 GitHub Pages 的入口文件。

要解决此问题，你需要在 ./pages 目录中创建一个名为 index.tsx 的文件。你的 index.tsx 应该看起来像这样：

环境变量

假设你的 TinaCMS clientID 和 token 已设置为环境变量，你需要将它们添加到项目的 GitHub Secrets 中。我们在上面的代码片段中使用的密钥是 TINA_PUBLIC_CLIENT_ID 和 TINA_TOKEN。