You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

如何在个人GitHub Pages中添加来自其他仓库的HTML页面

如何在个人GitHub Pages中添加来自其他仓库的HTML页面

嘿,我完全懂你不想搞那些繁琐的复制粘贴、整库克隆或者依赖第三方预览工具的想法,这里有两个精准匹配你需求的方案,既能把其他仓库的HTML页面加到你的GitHub Pages里,又不用违背你的几个原则:

方案一:用GitHub Actions自动拉取单个HTML文件

这个方法通过自定义工作流,每次你的GitHub Pages仓库更新(或者目标项目仓库更新时触发),自动从其他仓库拉取你需要的单个HTML文件,全程不用手动操作:

  1. 在你的GitHub Pages仓库根目录下创建 .github/workflows/deploy.yml 文件
  2. 把下面的代码复制进去,记得替换成你自己的仓库信息、分支路径:
name: Fetch Project HTML & Deploy Pages
on:
  # 当Pages仓库的main分支有推送时触发
  push:
    branches: [main]
  # 也可以设置当目标项目仓库更新时触发(需要在目标仓库加对应触发动作)
  repository_dispatch:
    types: [project_updated]

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      # 拉取当前Pages仓库的代码
      - name: Checkout Pages Repository
        uses: actions/checkout@v4

      # 创建存放项目页面的目录(如果不存在的话)
      - name: Create Projects Directory
        run: mkdir -p projects

      # 从目标仓库拉取指定的HTML文件到projects目录下
      - name: Fetch my_project.html
        run: |
          curl -L https://raw.githubusercontent.com/你的用户名/my_repo/你的分支名/文件路径/my_project.html -o projects/my_project.html

      # 上传部署产物
      - name: Upload Pages Artifact
        uses: actions/upload-pages-artifact@v3
        with:
          path: ./

      # 部署到GitHub Pages
      - name: Deploy to GitHub Pages
        uses: actions/deploy-pages@v4
  1. 提交并推送这个文件到Pages仓库,之后工作流就会自动帮你拉取文件并部署了。

这个方案完美符合你的要求:不用把整个项目加到Pages仓库、不用克隆完整项目、不用第三方工具、完全不用手动复制粘贴。

方案二:用Git稀疏检出的子模块

如果希望文件能和原仓库保持更紧密的同步,可以用Git的稀疏检出功能,只拉取子模块里你需要的单个文件,而不是整个项目仓库:

  1. 在本地打开你的GitHub Pages仓库,执行以下命令添加子模块(替换成你的目标仓库地址):
git submodule add https://github.com/你的用户名/my_repo.git my_repo
  1. 进入子模块目录,配置稀疏检出:
cd my_repo
git config core.sparseCheckout true
# 写入你需要拉取的文件路径,比如path/to/my_project.html
echo "your/file/path/my_project.html" >> .git/info/sparse-checkout
git pull
cd ..
  1. 提交子模块配置到Pages仓库:
git add .gitmodules my_repo
git commit -m "Add sparse submodule for my_project.html"
git push
  1. 最后去你的GitHub Pages设置页面,找到“Build and deployment”部分,确保勾选了“Include submodules”选项。

这个方法只会拉取你指定的单个HTML文件,不会克隆整个项目仓库,文件也会和原仓库自动同步,同样满足你的所有要求。

备注:内容来源于stack exchange,提问作者Ender Wiggins

火山引擎 最新活动