Hugo搭建自己的blog
之前一直使用pugo作为blog的搭建工具,最近有一些新的功能需要使用,就换成Hugo来搭建了。 下面记录整个过程。
1 最终搭建的链接和效果图
博客访问入口 https://www.michaelapp.com/

2 搭建博客系统结构图
特性:
- (1) 支持MarkDown 
- (2) 支持评论 
- (3) 支持自定义Menu 
- (4) 支持统计 
- (5) 支持搜索 
- (6) 支持Google统计 
搭建的系统图:

3 使用到的工具 Caddy
Caddy 实现HTTPS和反向代理功能,其能自动下载和更新HTTPS证书,其主要特点是配置极其简单.
下载:https://caddyserver.com/download
Caddy配置文件路径 /etc/caddy/Caddyfile,如无该文件,自行建立一个 配置(/etc/caddy/Caddyfile)如下: 外部端口80, 本地端口2000
https://www.michaelapp.com {
    proxy / 127.0.0.1:2000
}
4 使用到的工具Hugo和主题
https://github.com/gohugoio/hugo/releases 下载hugo_0.53_Windows-64bit.zip
创建主页
$ mkdir blogtest
$ cd blogtest
$ hugo new site myselfsite
输出下面内容,表示创建OK!
Congratulations! Your new Hugo site is created in E:\blogtest\myselfsite.
Just a few more steps and you're ready to go:
1. Download a theme into the same-named folder.
   Choose a theme from https://themes.gohugo.io/, or
   create your own with the "hugo new theme <THEMENAME>" command.
2. Perhaps you want to add some content. You can add single files
   with "hugo new <SECTIONNAME>\<FILENAME>.<FORMAT>".
3. Start the built-in live server via "hugo server".
Visit https://gohugo.io/ for quickstart guide and full documentation.
查看创建的目录
$ ls -l myselfsite
drwxr-xr-x 1 Think 197121  0 1月  30 14:37 archetypes/
-rw-r--r-- 1 Think 197121 82 1月  30 14:37 config.toml
drwxr-xr-x 1 Think 197121  0 1月  30 14:37 content/
drwxr-xr-x 1 Think 197121  0 1月  30 14:37 data/
drwxr-xr-x 1 Think 197121  0 1月  30 14:37 layouts/
drwxr-xr-x 1 Think 197121  0 1月  30 14:37 static/
drwxr-xr-x 1 Think 197121  0 1月  30 14:37 themes/
$ cd myselfsite
查看站点
$ hugo server
Watching for changes in E:\blogtest\myselfsite\{content,data,layouts,static}
Watching for config changes in E:\blogtest\myselfsite\config.toml
Environment: "development"
Serving pages from memory
Running in Fast Render Mode. For full rebuilds on change: hugo server --disableFastRender
Web Server is available at http://localhost:1313/ (bind address 127.0.0.1)
Press Ctrl+C to stop
此时查看到的是一个空的页面 下面建立一篇博客
$ cd myselfsite
$ hugo new post/first.md
$ hugo server --buildDrafts --watch
此时查看到的仍然是一个空的页面,由于还没有主题
$ cd myselfsite
$ git clone https://github.com/rujews/maupassant-hugo themes/maupassant
$ hugo server --theme=maupassant --buildDrafts --watch
此时再访问 localhost:1313 就可以看到内容了
5 config.toml 参数配置
config.toml可以配置出更多的功能(菜单,统计,评论,分页数,阅读数等)
baseURL = "https://www.michaelapp.com/"
languageCode = "zh-CN"
title = "Michael.Pan的博客"
theme = "maupassant"
googleAnalytics = "UA-xxxxx-1"
hasCJKLanguage = true
copyright = "© 2019. All rights reserved."
relativeurls = true
## 保持分类的原始名字(false会做转小写处理)
preserveTaxonomyNames = true
## 是否禁止URL Path转小写
disablePathToLower = true
# 分页
paginate = 10
paginatePath = "page"
archive-paginate = 50
[author]
  name = "Michael.Pan"
[params]
  author = "Michael.Pan"
  subtitle = "专注于物联网、人工智能、AR/VR、Android等软件设计和研发"
  keywords = "iot,ar,vr,ai,go语言,golang,Michael.Pan,博客,项目管理,软件架构"
  description = "专注于物联网、人工智能、AR/VR、Android等软件设计和研发"
[params.features]
    enable = true
	
[menu]
  [[menu.main]]
    identifier = "archives"
    name = "全部"
    url = "/archives/"
    weight = 2
  [[menu.main]]
    identifier = "about"
    name = "关于"
    url = "/about/"
    weight = 5
	
	
##更多详见 https://utteranc.es
[params.utteranc]
	enable = true
    repo = "panyingyun/utterances"    # 存储评论的Repo,格式为 owner/repo
    issueTerm = "pathname"  #表示你选择以那种方式让github issue的评论和你的文章关联。
    theme = "github-light" # 样式主题,有github-light和github-dark两种
[params.busuanzi]
  busuanzi = true
其余更多配置可以参考: https://github.com/rujews/maupassant-hugo
6 打包Blog为服务
使用下面的命令,生成public目录,即blog的全部文件
$ cd myselfsite
$ hugo 
有几种方法将Caddy 和 静态文件联系起来。
Caddy + Caddy Hugo插件的方式,看到过,但没试过。
这里选择 Macaron(go web server) + 二进制打包的方式进行。
Macaron原生就支持二进制打包,这样部署起来非常方便,主要代码如下。
func StartHttpServer(addr string) {
	macaron.Env = macaron.PROD
	m := macaron.New()
	m.Use(macaron.Logger())
	m.Use(macaron.Recovery())
	m.Use(macaron.Static("public",
		macaron.StaticOptions{
			FileSystem: bindata.Static(bindata.Options{
				Asset:      public.Asset,
				AssetDir:   public.AssetDir,
				AssetNames: public.AssetNames,
				AssetInfo:  public.AssetInfo,
				Prefix:     "",
			}),
		},
	))
	m.Use(macaron.Renderer(macaron.RenderOptions{
		TemplateFileSystem: bindata.Templates(bindata.Options{
			Asset:      templates.Asset,
			AssetDir:   templates.AssetDir,
			AssetNames: templates.AssetNames,
			AssetInfo:  templates.AssetInfo,
			Prefix:     "templates",
		}),
	}))
	//Test Web
	//m.Get("/:name", appserver)
	m.RunAddr(addr)
}
其余代码请参见 https://github.com/panyingyun/blog 这样部署的好处,可以查看用户访问日志和响应时间
[Macaron] 2019-01-30 15:37:44: Started GET /posts/2016/2016-02-14-Google-Java-Code-Style/ for 45.32.52.106
[Macaron] [Static] Serving /posts/2016/2016-02-14-Google-Java-Code-Style/index.html
[Macaron] 2019-01-30 15:37:44: Completed /posts/2016/2016-02-14-Google-Java-Code-Style/ 200 OK in 817.549µs
[Macaron] 2019-01-30 15:37:50: Started GET /posts/2015/2015-11-23-CentOS7.0/ for 45.32.52.106
[Macaron] [Static] Serving /posts/2015/2015-11-23-CentOS7.0服务器软件安装/index.html
[Macaron] 2019-01-30 15:37:50: Completed /posts/2015/2015-11-23-CentOS7.0/ 200 OK in 1.806836ms
[Macaron] 2019-01-30 15:38:26: Started GET /posts/2014/2014-12-05-DPI/ for 45.32.52.106
[Macaron] [Static] Serving /posts/2014/2014-12-05-DPI和px直接的关系/index.html
[Macaron] 2019-01-30 15:38:26: Completed /posts/2014/2014-12-05-DPI/ 200 OK in 1.105492ms
[Macaron] 2019-01-30 15:38:48: Started GET /posts/2013/2013-09-25-/ for 45.32.52.106
[Macaron] [Static] Serving /posts/2013/2013-09-25-查看android-签名文件的有效期限/index.html
[Macaron] 2019-01-30 15:38:48: Completed /posts/2013/2013-09-25-/ 200 OK in 4.605274ms
[Macaron] 2019-01-30 15:38:55: Started GET /posts/2013/2013-09-25-/ for 45.32.52.106
[Macaron] [Static] Serving /posts/2013/2013-09-25-Android进程的内存管理分析/index.html
[Macaron] 2019-01-30 15:38:55: Completed /posts/2013/2013-09-25-/ 200 OK in 675.09µs
[Macaron] 2019-01-30 15:38:59: Started GET /posts/2013/2013-09-25-/ for 45.32.52.106
[Macaron] [Static] Serving /posts/2013/2013-09-25-待研究内容/index.html
[Macaron] 2019-01-30 15:38:59: Completed /posts/2013/2013-09-25-/ 200 OK in 789.254µs