基于hugo+netlify搭建静态网站（一）

hugo生成静态网页

简介

Hugo是一个静态站点生成器，它利用了许多Go特性实现快速、流畅的运行，Go的HTML渲染工具、网络库、国际化功能等。所有这些Go特性都使Hugo易于拆包、运行和快速构建站点。

环境依赖

1. Mac OS 10.15
2. git

hugo安装

mac OS

1. 通过brew工具搜索并安装Hugo，其中可自行搜索brew工具的安装方法。

Windows系统

自行搜索

检查

可通过以下命令检查Hugo是否安装成功，该命令会显示Hugo的版本号。

$ hugo version

创建hugo工程

命令行进入任意目录（该目录用于存放Hugo工程），执行以下命令建立站点。

# blog即为Hugo工程
xiaxxxdeMacBook-Pro:~ xiaxxx$ hugo new site blog

初始化

首先回到工程根目录（这里是blog目录）。

1. 生成“关于”页面

$ hugo new about/_index.md

2. 生成“标签”页面

$ hugo new tags/_index.md

确认设置结果，通过以下命令启动服务器，并通过http://localhost:1313/访问。

$ hugo server

撰写文章

撰写第一篇文章

使用以下命令创建一篇文章，注意所有的文章都需要在posts文件夹下。

$ hugo new posts/hugo/get-start.md

编辑文章内容 打开posts\hugo\get-start.md，可以看到如下内容：

---
title: "安装hugo Theme Pure"
description: "从零开始搭建属于自己的静态网站"
date: 2021-09-30T19:48:43+08:00
draft: true
tags: ["hugo"]
categories: ["博客搭建"]
---

在这一部分设置、“标题”、“描述、“时间”、“是否在主页显示”、“标签”、“分类”等内容。在下面的空白部分，就可以遵循Markdown语法撰写文章了。

发布站点

在站点根目录下执行如下命令，自动生成静态页面。

$ hugo

执行完毕后，会在工程根目录下自动生成一个public文件夹，里面就是自动生成好的站点了，注意这里只会生成网站的静态文件而不包括文章的静态文件内容，如果想要生成文章的静态页面，可使用以下命令。

$ hugo --theme=pure --buildDrafts
# theme 指定主题
# buildDrafts 生成文章静态页面

上传到托管服务器 将public文件夹中的内容上传到托管服务器，就可以通过ip或域名访问站点了。