# 在 quickstart 目录中为您的项目创建目录结构。
hugo new site quickstart

# 在项目目录中初始化一个空的 Git 仓库
cd quickstart
git init

# 将 hugo-code 主题克隆到 themes 目录中，并将其作为 Git 子模块 添加到您的项目中。
git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/hugo-code

# 向站点配置文件中追加一行，指示当前使用的主题。
echo "theme = 'hugo-code'" >> hugo.toml

# 启动 Hugo 的开发服务器以查看网站。
hugo server

# 按下 Ctrl + C 停止 Hugo 的开发服务器。

添加新的页面 Link to heading

hugo new content/posts/my-first-post.md

Hugo 会在 content/posts 目录中创建该文件。使用编辑器打开该文件。

注意 [front matter] 中的 draft 值为 true。默认情况下，Hugo 在构建网站时不会发布草稿内容。

在文章正文中添加内容后保存。启动 Hugo 的开发服务器以查看网站。您可以运行以下命令之一来包含草稿内容。

hugo server --buildDrafts
hugo server -D

在终端中显示的 URL 中查看您的网站。随着继续添加和更改内容，请保持开发服务器运行。

配置网站 Link to heading

使用编辑器打开项目根目录下的网站配置文件（hugo.toml）。

baseURL = 'https://example.org/'
languageCode = 'en-us'
title = '我的新 Hugo 网站'
theme = 'hugo-code'

进行以下更改：

为您的生产网站设置 baseURL。该值必须以协议开头，并以斜杠结尾，如上所示。
将 languageCode 设置为您的语言和地区。
为您的生产网站设置 title。

大多数主题作者提供配置指南和选项。请务必访问您的主题的存储库或文档站点了解详细信息。

发布网站 Link to heading

hugo

在此步骤中，您将“发布”网站，但不会 “部署”它。

当您“发布”网站时，Hugo 会在项目根目录的 public 目录中创建整个静态网站。其中包括 HTML 文件和像图像、CSS 文件和 JavaScript 文件这样的资源。

当您发布网站时，通常不希望包含[草稿、将来或过期内容]。

部署网站 Link to heading

在 GitHub Pages 上托管 | Hugo官方文档

步骤1
创建一个GitHub仓库。
步骤2
将本地仓库推送到GitHub。
步骤3
访问您的GitHub仓库。从主菜单选择设置 > Pages。您的屏幕中央会显示如下内容：
步骤4
将Source更改为GitHub Actions。更改是即时的，无需按下保存按钮。
步骤5
在本地仓库中创建一个空文件。
```
.github/workflows/hugo.yaml
```

步骤6

将下面的YAML代码复制并粘贴到您创建的文件中。根据需要更改分支名称和Hugo版本。

# 用于构建和部署Hugo网站到GitHub Pages的工作流程
name: Deploy Hugo site to Pages

on:
  # 在目标为默认分支的推送上运行
  push:
    branches:
      - main

  # 允许您手动从“Actions”标签运行此工作流程
  workflow_dispatch:

# 设置GITHUB_TOKEN的权限，以允许部署到GitHub Pages
permissions:
  contents: read
  pages: write
  id-token: write

# 仅允许一个并发部署，跳过在进行中的运行与最新排队的运行之间排队的运行。
# 但是，请不要取消进行中的运行，因为我们希望这些生产部署能够完成。
concurrency:
  group: "pages"
  cancel-in-progress: false

# 默认使用bash
defaults:
  run:
    shell: bash

jobs:
  # 构建作业
  build:
    runs-on: ubuntu-latest
    env:
      HUGO_VERSION: 0.148.1
    steps:
      - name: 安装Hugo CLI
        run: |
          wget -O ${{ runner.temp }}/hugo.deb https://github.com/gohugoio/hugo/releases/download/v${HUGO_VERSION}/hugo_extended_${HUGO_VERSION}_linux-amd64.deb \
          && sudo dpkg -i ${{ runner.temp }}/hugo.deb          
      - name: 安装Dart Sass
        run: sudo snap install dart-sass
      - name: 检出
        uses: actions/checkout@v4
        with:
          submodules: recursive
          fetch-depth: 0
      - name: 设置Pages
        id: pages
        uses: actions/configure-pages@v5
      - name: 安装Node.js依赖
        run: "[[ -f package-lock.json || -f npm-shrinkwrap.json ]] && npm ci || true"
      - name: 使用Hugo构建
        env:
          # 为了与Hugo模块的最大向后兼容性
          HUGO_ENVIRONMENT: production
          HUGO_ENV: production
        run: |
          hugo \
            --gc \
            --minify \
            --baseURL "${{ steps.pages.outputs.base_url }}/"          
      - name: 上传构建产物
        uses: actions/upload-pages-artifact@v3
        with:
          path: ./public

  # 部署作业
  deploy:
    environment:
      name: github-pages
      url: ${{ steps.deployment.outputs.page_url }}
    runs-on: ubuntu-latest
    needs: build
    steps:
      - name: 部署到GitHub Pages
        id: deployment
        uses: actions/deploy-pages@v4

步骤7

使用类似"Add workflow"的提交消息将更改提交到本地仓库，并推送到GitHub。

# 添加远程仓库, origin作为别名
git remote add origin https://github.io/<username>.github.io

git commit  -m 'Add workflow'
git push origin main

步骤8
从GitHub的主菜单中选择Actions。你会看到如下内容：
当GitHub完成构建和部署您的站点后，状态指示器的颜色将变为蓝色。
将来，每当您从本地仓库推送更改时，GitHub都会重新构建您的站点并部署更改。

上面的示例工作流程包括以下步骤，通常需要10-15秒：

- name: 安装Dart Sass
  run: sudo snap install dart-sass

如果您的站点、主题和模块不使用Dart Sass转译Sass到CSS，您可以删除此步骤。

概述 Link to heading

相关技术 Link to heading

参考文档 Link to heading

建站流程 Link to heading

安装 hugo Link to heading

安装 Git Link to heading

安装 PowerShell Link to heading

本地创建网站 Link to heading

添加新的页面 Link to heading

配置网站 Link to heading

发布网站 Link to heading

部署网站 Link to heading