当前位置:首页 > 技术文章 > 正文内容

博客引擎 hugo intro 入门介绍+安装笔记

arlanguage5个月前 (12-17)技术文章37

拓展阅读

blog-engine-01-常见博客引擎 jekyll/hugo/Hexo/Pelican/Gatsby/VuePress/Nuxt.js/Middleman 对比[1]

blog-engine-02-通过博客引擎 jekyll 构建 github pages 博客实战笔记[2]

blog-engine-02-博客引擎jekyll-jekyll 博客引擎介绍[3]

blog-engine-02-博客引擎jekyll-jekyll 如何在 windows 环境安装,官方文档[4]

blog-engine-02-博客引擎jekyll-jekyll SEO[5]

blog-engine-04-博客引擎 hugo intro 入门介绍+安装笔记[6]

blog-engine-05-博客引擎 Hexo 入门介绍+安装笔记[7]

blog-engine-06-pelican 静态网站生成 官方文档[8]

blog-engine-06-pelican 静态网站生成 windows 安装实战[9]

blog-engine-07-gatsby 建极速网站和应用程序 基于React的最佳框架,具备性能、可扩展性和安全性[10]

blog-engine-08-vuepress 以 Markdown 为中心的静态网站生成器[11]

blog-engine-09-nuxt 构建快速、SEO友好和可扩展的Web应用程序变得轻松[12]

blog-engine-10-middleman 静态站点生成器,利用了现代 Web 开发中的所有快捷方式和工具[13]

前言

由于个人一直喜欢使用 markdown 来写 个人博客[14],最近就整理了一下有哪些博客引擎。

感兴趣的小伙伴也可以选择自己合适的。

hugo 博客引擎

Hugo 是一个流行的静态网站生成器,它被广泛用于创建博客和静态网站。

1.

静态网站生成器:Hugo 是一个静态网站生成器,它将你的博客内容转换为 HTML、CSS 和 JavaScript 文件,这些文件可以直接部署到 Web 服务器上。相比于动态网站,静态网站具有更快的加载速度和更高的安全性。

2.

快速高效:Hugo 被设计成非常快速和高效的静态网站生成器。它使用 Go 语言编写,采用了一些优化策略,如并行处理、增量构建等,以确保生成网站的速度和效率。

3.

简单易用:Hugo 的使用非常简单,它提供了一个简洁的命令行界面和易于理解的目录结构。你只需编写 Markdown 格式的博客文章,并使用 Hugo 的命令将其转换为静态网页。

4.

主题和布局:Hugo 提供了丰富的主题和布局选项,使你能够轻松地自定义你的博客外观。你可以选择一个现成的主题,也可以根据自己的需求创建自定义主题。

5.

多语言支持:Hugo 支持多语言功能,你可以轻松创建多语言的博客。它提供了语言文件和语言选择器等功能,方便你管理和展示多语言内容。

6.

强大的功能:Hugo 提供了许多强大的功能,如标签、分类、分页、搜索等。它还支持各种插件和扩展,可以满足不同需求的博客功能。

Hugo 是一个功能强大、快速高效且易于使用的博客引擎,适合个人博客、技术博客和静态网站的创建。

无论你是初学者还是有经验的开发者,都可以通过 Hugo 轻松地构建出专业水平的博客网站。

hugo windows 入门例子

require

Git

λ git --version
git version 2.33.1.windows.1

Go

λ go version
go version go1.21.5 windows/amd64

Dart Sass: 用于做 sass 转换为 css[15]

install

1.安装 Hugo。你可以从 Hugo 官网[16] 下载 Hugo 的二进制文件,然后将其解压到你的电脑上。

windows 的话:

https://gohugo.io/installation/windows/

release 地址:

https://github.com/gohugoio/hugo/releases/tag/v0.121.1

这里选择了:

https://github.com/gohugoio/hugo/releases/download/v0.121.1/hugo_0.121.1_windows-amd64.zip

下载之后解压,这是一个可执行的 exe

比如解压到:

C:\Users\dh\Downloads\hugo_0.121.1_windows-amd64

quick start

使用 WSL 或者 git bash,我们在文件夹 C:\Users\dh\Downloads\hugo_0.121.1_windows-amd64 下打开命令行

hugo new site quickstart
cd quickstart


git init
git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/ananke
echo "theme = 'ananke'" >> hugo.toml


hugo server

PS: 这里 hugo.toml 估计会报错。

建议手动修改:

baseURL = 'https://example.org/'
languageCode = 'en-us'
title = 'My New Hugo Site'
theme = 'ananke'

如果配置了 path,就可以直接执行 hugo server。

没配置,可以指定全路径

C:\Users\dh\Downloads\hugo_0.121.1_windows-amd64\hugo server

主题

https://themes.gohugo.io/

access

访问你的博客。你可以在浏览器中访问以下地址:

http://localhost:1313/

你应该会看到你的博客页面,不过默认这里 pages 是空的。

添加 page 页面

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

or

C:\Users\dh\Downloads\hugo_0.121.1_windows-amd64\hugo new content posts/my-first-post.md

创建一个新的文件。

修改文件内容

---
title: "My First Post"
date: 2022-11-20T09:03:20-08:00
draft: true
---
## Introduction


This is **bold** text, and this is *emphasized* text.


Visit the [Hugo](https://gohugo.io) website!

重新执行

hugo server -D


# 若要显示 draft 为 true 的草稿,则用下命令
# 若要在之后网页中显示文章,则要把 draft 改为 false

or

C:\Users\dh\Downloads\hugo_0.121.1_windows-amd64\hugo server -D

界面还是很不错的。

部署

你可以将你的 Hugo 网站部署到任何 Web 服务器上。

例如,你可以使用 Nginx[17]Apache[18] 来部署你的 Hugo 网站。

或者 github pages

References

[1] blog-engine-01-常见博客引擎 jekyll/hugo/Hexo/Pelican/Gatsby/VuePress/Nuxt.js/Middleman 对比: https://houbb.github.io/2016/04/13/blog-engine-01-overview
[2] blog-engine-02-通过博客引擎 jekyll 构建 github pages 博客实战笔记:
https://houbb.github.io/2016/04/13/blog-engine-02-jekyll-01-install
[3] blog-engine-02-博客引擎jekyll-jekyll 博客引擎介绍:
https://houbb.github.io/2016/04/13/blog-engine-03-jekyll-02-intro
[4] blog-engine-02-博客引擎jekyll-jekyll 如何在 windows 环境安装,官方文档:
https://houbb.github.io/2016/04/13/blog-engine-03-jekyll-03-install-on-windows-doc
[5] blog-engine-02-博客引擎jekyll-jekyll SEO:
https://houbb.github.io/2016/04/13/blog-engine-03-jekyll-04-seo
[6] blog-engine-04-博客引擎 hugo intro 入门介绍+安装笔记:
https://houbb.github.io/2016/04/13/blog-engine-04-hugo-intro
[7] blog-engine-05-博客引擎 Hexo 入门介绍+安装笔记:
https://houbb.github.io/2017/03/29/blog-engine-05-hexo
[8] blog-engine-06-pelican 静态网站生成 官方文档:
https://houbb.github.io/2016/04/13/blog-engine-06-pelican-01-intro
[9] blog-engine-06-pelican 静态网站生成 windows 安装实战:
https://houbb.github.io/2016/04/13/blog-engine-06-pelican-02-quick-start
[10] blog-engine-07-gatsby 建极速网站和应用程序 基于React的最佳框架,具备性能、可扩展性和安全性:
https://houbb.github.io/2016/04/13/blog-engine-07-gatsby-01-intro
[11] blog-engine-08-vuepress 以 Markdown 为中心的静态网站生成器:
https://houbb.github.io/2016/04/13/blog-engine-08-vuepress-01-intro
[12] blog-engine-09-nuxt 构建快速、SEO友好和可扩展的Web应用程序变得轻松:
https://houbb.github.io/2016/04/13/blog-engine-09-nuxt-01-intro
[13] blog-engine-10-middleman 静态站点生成器,利用了现代 Web 开发中的所有快捷方式和工具:
https://houbb.github.io/2016/04/13/blog-engine-10-middleman-01-intro
[14] 个人博客:
https://houbb.github.io/
[15] Dart Sass: 用于做 sass 转换为 css:
https://gohugo.io/hugo-pipes/transpile-sass-to-css/#dart-sass
[16] Hugo 官网:
https://gohugo.io/
[17] Nginx:
https://www.nginx.com/
[18] Apache:
https://httpd.apache.org/

扫描二维码推送至手机访问。

版权声明:本文由AR编程网发布,如需转载请注明出处。

本文链接:http://www.arlanguage.com/post/264.html

分享给朋友:

“博客引擎 hugo intro 入门介绍+安装笔记” 的相关文章

使用Keepalived实现Nginx的自动重启及双主热备高可用

推荐阅读:20年清华架构师耗时整整一百天打造1000+道Java高频面试手册1、概述之前我们使用Keepalived实现了Nginx服务的双机主备高可用,但是有几个问题没有解决,今天一起探讨一下。1)在双机主备机制中,Keepalived服务如果宕了,会自动启用备机进行服务,但Nginx服务如果负载...

Linux下如何用nginx+ffmpeg搭建流媒体服务器

安装ffmpeg安装过程略安装完成后,检查是否安装成功。比如我这里采用向pili推流的方式,将本地的一个mp4视频推流到七牛pili。ffmpeg -re -i /tmp/ffmpeg_test.mp4 -vcodec copy -acodec copy -f flv "rtmp://pil...

基于Docker一键LNMP(Nginx+MySQL+PHP7/5+Redis)安装程序

一键部署LNMP环境的目的,该环境特点:完全开源支持多版本PHP切换(PHP5.4、PHP5.6、PHP7.2...)支持绑定任意多个域名支持HTTPS和HTTP/2PHP源代码位于host中MySQL data位于host中所有配置文件可在host中直接修改所有日志文件可在host中直接查看内置完...

Nginx 的日志 nginx的日志能否保存到日志审计里面?

Nginx 的日志主要有 2 个,一个是 access.log, 一个是 error.log。如果你不进行任何配置的话,这 2 个日志将会使用默认的日志配置,这个日志将会位于/var/log/nginx 目录中。针对虚拟主机的配置如果你使用了 Nginx 为虚拟主机的话。那么你可以在你的虚拟主机的配...

基于一次ContentDownload变慢而进行的网站性能优化

平时运行无常的网站,突然出现了某个接口TTFB缓慢问题,于是乎开始定位和解决,先说明一下网站的技术栈: 编程语言:PHP、Javascript、Vue、Java 开发框架:Laravel、SpringBoot 中间件:Redis、Kafka、Nginx 数据库:Mysql、MongoDB 云服务:腾...

Nginx 最全操作——nginx配置(2)

nginx 配置基本结构main # 全局配置,对全局生效 ├── events # 配置影响 nginx 服务器或与用户的网络连接 ├── http # 配置代理,缓存,日志定义等绝大多数功能和第三方模块的配置 │ ├── upstream # 配置后端服务器具体地址,负...