GitHub搭建自己的静态网页

Deploy.yml

name: Deploy to GitHub Pages

on:
  push:
    branches: [main]
  workflow_dispatch:

jobs:
  deploy:
    name: Deploy to GitHub Pages
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3

      - name: Use Node.js 18
        uses: actions/setup-node@v3
        with:
          node-version: 18

      - name: Install dependencies
        run: yarn

      - name: Build website
        run: yarn build

      - name: deploy to GitHub Pages
        uses: peaceiris/actions-gh-pages@v3
        with:
          github_token: ${{ secrets.HSQ }}
          publish_dir: ./dist
          user_name: 'HSQCoollaughing'
          user_email: 'hongshengqin66@gmail.com'

secrets.HSQ

新建Token（全局的）

到这里，全局Token就建好了!!!

单个仓库的

开始构建步骤

发布

注意

1. GitHUb可能失败

2. 发布后可能会出现白屏现象，配置打包工具就行 ，拿Vite举例，配置base: ./或者GitHub给我们的域名+仓库名字，最好是配置base: ./方便我们自定义域名！！！！

自定义域名

docs.github.com/en/pages/co…

docs.github.com/en/pages/co…

Warning:  We strongly recommend that you do not use wildcard DNS records, such as *.example.com. These records put you at an immediate risk of domain takeovers, even if you verify the domain. For example, if you verify example.com this prevents someone from using a.example.com but they could still take over b.a.example.com (which is covered by the wildcard DNS record). For more information, see "Verifying your custom domain for GitHub Pages."

域名

我们可以用cloudflare管理自己的域名

缺陷

代码提交，自动构建，会使自定义域名失效，需要重新搞