在 Netlify 上托管

预备条件

在继续之前，请完成以下任务：

1. 创建 Netlify 账户
2. 安装 Git
3. 创建 Hugo 网站 ，并使用 hugo server 在本地进行测试
4. 将更改提交到本地存储库
5. 将本地存储库推送到您的 GitHub 、 GitLab 或 Bitbucket 账户

步骤

此步骤将启用从 GitHub 存储库的持续部署。如果您使用的是 GitLab 或 Bitbucket，则步骤基本相同。

步骤 1

登录您的 Netlify 账户，导航到“站点”页面，按 添加新站点 按钮，然后从下拉菜单中选择“导入现有项目”。

步骤 2

选择您的部署方法。

! 屏幕截图

步骤 3

按 授权 Netlify 按钮，授权 Netlify 连接您的 GitHub 账户。

! 屏幕截图

步骤 4

按 在 GitHub 上配置 Netlify 按钮。

! 屏幕截图

步骤 5

通过选择您的 GitHub 账户来安装 Netlify 应用。

! 屏幕截图

步骤 6

按 安装 按钮。

! 屏幕截图

步骤 7

从列表中点击站点的存储库。

! 屏幕截图

步骤 8

设置站点名称和要从中部署的分支。

! 屏幕截图

步骤 9

定义构建设置，按 添加环境变量 按钮，然后按 新建变量 按钮。

! 屏幕截图

步骤 10

创建一个名为 HUGO_VERSION 的新环境变量，并将值设置为 最新版本 。

! 屏幕截图

步骤 11

按页面底部的“部署我的新站点”按钮。

! 屏幕截图

步骤 12

在屏幕底部，等待部署完成，然后单击部署日志条目。

! 屏幕截图

步骤 13

按 打开生产部署 按钮以查看实时站点。

! 屏幕截图

配置文件

在上面的步骤中，我们使用 Netlify 用户界面配置了我们的站点。大多数站点所有者发现使用签入到源代码管理的配置文件更容易。

在项目目录的根目录下创建一个名为 netlify.toml 的新文件。在最简单的形式下，配置文件可能如下所示：

[build.environment]
HUGO_VERSION = "0.137.1"
TZ = "America/Los_Angeles"

[build]
publish = "public"
command = "hugo --gc --minify"

如果您的站点需要 Dart Sass 将 Sass 编译成 CSS，则配置文件应如下所示：

[build.environment]
HUGO_VERSION = "0.137.1"
DART_SASS_VERSION = "1.80.6"
TZ = "America/Los_Angeles"

[build]
publish = "public"
command = """\
  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 && \
  rm dart-sass-${DART_SASS_VERSION}-linux-x64.tar.gz && \
  export PATH=/opt/build/repo/dart-sass:$PATH && \
  hugo --gc --minify \
  """