Hugo 安装以及部署

Posted on Oct 26, 2023

Hugo 安装

在安装 Hugo 之外，我们先需要安装 git。

因为我的设备是 Windows，且我安装了 Chocolatey，所以直接按照官网的指引用一道命令就可以安装啦，使用命令下载 hugo-extended 版本：choco install hugo-extended 。extended 版本拥有更高级的特性，比如支持 sass，所以我们安装 extended 版本。

Hugo Hello World🌍

官网提示：不要使用 Windows 自带的命令行工具（因为下面的命令有一部分是 Linux 专属的），比如 CMD、PowerShell 等来执行 Hugo 命令。而是推荐使用 Linux 风格的 terminal 比如 Git Bash 和 WSL。

为了完成我们的 Hugo Hello World Demo，我们需要依次执行以下命令：

hugo new site my-blog，初始化一个 Hugo 网站，并生成相应的目录、文件。
cd my-blog，进入我们的博客目录。
git init，初始化一个 git 仓库。
cd themes，进入到 themes 文件夹，准备安装主题（Hugo 没有默认主题）。
git clone https://github.com/athul/archie.git，下载主题。
cd ../，返回上级菜单。
echo "theme = 'archie'" >> hugo.toml，将theme = 'archie'写入配置文件，启用我们刚刚下载的主题。
hugo server，启动服务器，这时如果一切正常，命令行最后两行输出应该是
```
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop
```
此时我们就可以打开浏览器，访问localhost:1313我们的网站啦！但此时打开网页并没有内容。所以我们现在来创建我们第一篇文章吧！首先需要关闭服务器，然后执行下面的命令。

开始写文章

我们使用 hugo new content posts/first-blog.md，执行这个命令将在 post 目录下新建一篇名为 first-blog 的文章。使用编辑器打开，我们会看见如下内容： +++ title = 'first-blog' date = 2023-10-26T22:19:57+08:00 draft = true +++ 我们注意到 draft 标记是 true状态，这表明这一篇文章是草稿状态，如果要发布，记得将它改为 false。现在我们在正文输入 ```md ## Hugo

Hello, World!
```
随后再次启动服务器，`hugo new server -D`，这表示启动服务器并显示草稿文章。这样，我们的 Hello World 就制作完成啦！

## hugo 使用 tips
- 以局域网的方式启动，使局域网的设备都可以访问： `$ hugo server --bind ${IP} --baseURL ${IP}` 。比如，如果本机的 IP 是 `192.168.0.20`，那么启动命令就是：`$ hugo server --bind 192.168.0.20 --baseURL http://192.168.0.20/`