美文网首页
如何使用 Hugo 搭建个人博客

如何使用 Hugo 搭建个人博客

作者: Liveup | 来源:发表于2020-03-11 08:17 被阅读0次

弃坑 Hexo,投入 Hugo 的怀抱

Hugo 其实是一个命令行工具,帮助我们生成静态网页。

一、安装

  • masOS

    • 使用命令 brew install hugo
  • Windows

    1. 下载 realse zip 包
    2. 解压,将 hugo.exe 文件放入某盘:\software\Hugo\bin
    3. 配置环境变量 PATH,添加 hugo.exe 存放路径
  • 验证安装:

$ hugo version
Hugo Static Site Generator v0.67.0-7F1DA3EF windows/amd64 BuildDate: 2020-03-09T20:35:55Z

二、使用

参考官方文档

Ⅰ 创建一个全新的 Hugo 网站,存放于指定的文件夹中

$ hugo new site amanda.github.io-creator

Ⅱ 添加一个主题

  1. 下载主题,这里使用官方文档主题 Ananke theme
$ cd amanda.github.io-creator
$ git init
$ git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke
$ rm -rf themes\ananke\.git
  1. 向配置文件(config.toml)中追加主题配置
$ echo 'theme = "ananke"' >> config.toml

注意!请注意!对于Windows用户来说,此处为后续埋下了一个坑,改用下述语句或手动删除单引号对

$ echo theme = "ananke" >> config.toml
  1. 更换主题:“下载主题” -> “修改主题配置”

Ⅲ 开始写博客啦

  1. 创建一篇新的博客,hugo new posts/第一篇.md
  2. 打开 posts/第一篇.md,想写啥写啥

每篇博客,都包含如下开头:

---
title: "My First Post"
date: 2020-03-10T21:02:01+08:00
draft: true
---

其中,draft 意为 “草稿”,默认值为true,代表此篇内容编译时将被忽略;改为 false,该篇博客才能被编译使用。

Ⅳ 启动 Hugo 服务

  1. 启动命令,hugo server -D
  2. 访问博客,默认网址 http://localhost:1313/
    [图片上传失败...(image-e23ed-1583885841226)]

Ⅴ 编译静态页面

  1. 编译命令,hugo -D
  2. 编译结果:默认生成 ./pulic 目录
  3. 手动指定编译生成的目录
    • 编译命令中添加选项 [-d/--destination] 指定发布文件夹
    • 配置文件中通过 publishdir 指定

Ⅵ 编译发布到 GitHub

  1. 将 public 目录作为一个单独的 Git 仓库,上传到 GitHub
  2. 设置 GitHub Pages,预览

相关文章

  • 如何使用 Hugo 搭建个人博客

    弃坑 Hexo,投入 Hugo 的怀抱 Hugo 其实是一个命令行工具,帮助我们生成静态网页。 一、安装 masO...

  • 使用Git更新Hugo 个人博客

    使用Git更新Hugo 个人博客 该文章主要是讨论,如何在本地搭建好hugo静态网页后,上传git到自己的域名下。...

  • 使用hugo搭建静态博客网站

    使用hugo搭建静态博客网站 hugo是使用go语言编写的快速搭建静态博客的工具。 安装我使用的系统是Ubuntu...

  • 使用HUGO搭建个人博客

    本文首发于我的个人博客:Suixin's Blog Hugo是一个用Go编写的静态站点生成器,由于具有丰富的主题资...

  • 使用 Hugo 搭建个人博客

    一、从 Hugo 的 GitHub Releases 下载与操作系统相对应的二进制文件 由于我使用的是 Windo...

  • 使用 Hugo 搭建个人博客

    从 Hugo 的 GitHub Releases 下载与操作系统相对应的二进制文件 由于我使用的是 Windows...

  • 使用Hugo搭建GitHub个人博客

    主题概况 Hugo 是一个用 Go 语言编写的静态网站生成器。类似的静态网站生成器还有Jekyll、hexo等等。...

  • 使用 Hugo 搭建个人静态博客

    Overview Hugo 是一款使用 Go 编写的静态网站生成工具,和其它工具相比其静态页面的生成速度有很大优势...

  • 使用Hugo搭建个人博客网站

    前言 两年前用Hexo搭建博客,但是因为各种配置问题没有继续跟进,之后就一直在简书写的博客。恰逢看到新的博客生成工...

  • hugo搭建个人博客

    hugo搭建个人博客 1. hugo的安装 windows下hugo的安装 在hugo的官网下载 hugo 的二进...

网友评论

      本文标题:如何使用 Hugo 搭建个人博客

      本文链接:https://www.haomeiwen.com/subject/msefjhtx.html