Gitlab Page

Hugo 文章寫好後，我們可以將這些文章建立並產生正式版本的純 html 檔案，並將這些檔案上傳至 Gitlab Pages
Categories:
Tags:

Gitlab 與 Github 都有提供靜態空間頁面給我們放上靜態的 html, css, js 檔案，可以變成一個靜態頁面供網友存取，但 Github pages 的空間如果要變成私密的方式，不想要讓其他人可以直接下載你整包的網站 html 的話，只能 付費 才能夠有這個功能，Gitlab pages 則是免費就可以使用私密的方式架設你的網站，不需要額外付費

Hugo 產生出來的靜態檔案放在 public 目錄，可以將 Gitlab Page 的目錄指定到 Repository 的 public 中

設定 Gitlab Page 部署設定檔 .gitlab-ci.yml

在 Repository 跟目錄建立 .gitlab-ci.yml 檔案，在 artifacts 設定 Gitlab pages 的目錄，並設定只有在 main 的分支才會部署

# .gitlab-ci.yml
image: alpine:latest

pages:
  stage: deploy
  script:
    - echo 'Do nothing'
  # gitlab page 目錄
  artifacts:
    paths:
      - public
  # 只有在 main 分支的 public 目錄才會被部署
  only:
    - main

建立 Hugo 靜態檔案

使用指令建立最後的 hugo 靜態頁面檔案，建立的檔案會放在 public 目錄中

$ hugo --gc

Repository Push 到 Gitlab 部署

在 Hugo 網站的 Repository 推到 Gitlab 後，Gitlab 會針對 .gitlab-ci.yml 的部署設定進行 Gitlab Page 的部署

到 Repo 的 CI/CD > Piplines 可以看到會立即執行部署的指令，看到狀態變更為 passed 就表示執行成功了

Gitlab page

檢視部署的 Gitlab Pages

在 Repo 的 Settings > Pages 那邊可以看到你的 Gitlab Pages 的網址，預設是 https://<帳號>.gitlab.io/<專案位置>，從這裡就可以看到你部署上去的頁面了

Gitlab page

詳細的 Gitlab Page 自訂網址 及 存取權限 可以參考 使用 Gitlab page 建立私密的靜態部落格網站

參考資料