Host on GitLab Pages

January 1, 1

假設

熟悉使用 Git 進行版本控制
完成 Hugo [快速入門]
擁有一個 GitLab 帳號
您的 Hugo 網站已經準備好，可以在本地機器上發布

BaseURL

如果您使用的是 GitLab Pages 的默認 URL（例如 https://<YourUsername>.gitlab.io/<your-hugo-site>/），則網站配置中的 baseURL 必須反映 GitLab 頁面存儲庫的完整 URL，而不是自定義域名。

配置 GitLab CI/CD

在項目根目錄中創建一個 .gitlab-ci.yml 文件，定義您的 CI/CD 作業。

.gitlab-ci.yml

variables:
  DART_SASS_VERSION: 1.80.6
  HUGO_VERSION: 0.137.1
  NODE_VERSION: 20.x
  GIT_DEPTH: 0
  GIT_STRATEGY: clone
  GIT_SUBMODULE_STRATEGY: recursive
  TZ: America/Los_Angeles

image:
  name: golang:1.22.1-bookworm

pages:
  script:
    # 安裝 brotli
    - apt-get update
    - apt-get install -y brotli
    # 安裝 Dart Sass
    - curl -LJO https://github.com/sass/dart-sass/releases/download/${DART_SASS_VERSION}/dart-sass-${DART_SASS_VERSION}-linux-x64.tar.gz
    - tar -xf dart-sass-${DART_SASS_VERSION}-linux-x64.tar.gz
    - cp -r dart-sass/ /usr/local/bin
    - rm -rf dart-sass*
    - export PATH=/usr/local/bin/dart-sass:$PATH
    # 安裝 Hugo
    - curl -LJO https://github.com/gohugoio/hugo/releases/download/v${HUGO_VERSION}/hugo_extended_${HUGO_VERSION}_linux-amd64.deb
    - apt-get install -y ./hugo_extended_${HUGO_VERSION}_linux-amd64.deb
    - rm hugo_extended_${HUGO_VERSION}_linux-amd64.deb
    # 安裝 Node.js
    - curl -fsSL https://deb.nodesource.com/setup_${NODE_VERSION} | bash -
    - apt-get install -y nodejs
    # 安裝 Node.js 依賴
    - "[[ -f package-lock.json || -f npm-shrinkwrap.json ]] && npm ci || true"
    # 構建
    - hugo --gc --minify
    # 壓縮
    - find public -type f -regex '.*\.\(css\|html\|js\|txt\|xml\)$' -exec gzip -f -k {} \;
    - find public -type f -regex '.*\.\(css\|html\|js\|txt\|xml\)$' -exec brotli -f -k {} \;
  artifacts:
    paths:
      - public
  rules:
    - if: $CI_COMMIT_BRANCH == $CI_DEFAULT_BRANCH

將您的 Hugo 網站推送到 GitLab

接下來，在 GitLab 上創建一個新的存儲庫。無需將存儲庫設為公開。另外，您可能希望將 /public 添加到 .gitignore 文件中，因為沒有必要將編譯後的資產推送到 GitLab，也無需將輸出網站納入版本控制。

# 初始化新的 git 存儲庫
git init

# 將 /public 目錄添加到 .gitignore 文件
echo "/public" >> .gitignore

# 提交並推送代碼到主分支
git add .
git commit -m "Initial commit"
git remote add origin https://gitlab.com/YourUsername/your-hugo-site.git
git push -u origin master

等待您的頁面構建

就這樣！您現在可以在 https://gitlab.com/<YourUsername>/<your-hugo-site>/pipelines 看到 CI 代理構建您的頁面。

構建完成後，您的新網站將可用，網址為 https://<YourUsername>.gitlab.io/<your-hugo-site>/。

下一步

GitLab 支持使用自定義 CNAME 和 TLS 證書。更多有關 GitLab Pages 的詳細信息，請參見 GitLab Pages 設置文檔.