使用Hexo有段时间了,总体的感觉还是很方便的,配合宇宙第一IDE:Visual Studio Code,书写、命令、版本管理,一起搞定,都不需要打开文件夹、powershell等。而且主题也很多,各个功能模块也很齐全。唯一的缺点是使用hexo g生成网页的时间有点长,要是还有缺点,那就是项目文件太庞大,因为hexo依赖nodejs,所以工程中需要一大堆node模块,一个工程建下来,差不多有10000个文件了。为了弥补这些缺点,Hugo横空出世了。
Hugo简介
Hugo号称是世界上最快的静态网页生成器。Hugo是用go语言编写的,go的编译速度非常快,而且运行速度也是杠杠的,据说能和C一教高下。Hugo也提供了多版本的程序供下载,我使用的是win64版本,下载完解压后就是一个exe文件。建立工程也很简单,hugo new site blog就建立了一个博客工程。与其说是一个工程,还不如说是一个目录结构,因为blog目录里面只有6个空文件夹和一个config.toml配置文件,超级简洁。经过与hexo的对比测试,同样的文章数量,在hexo下需要4-5秒的时间来生成网页,而在hugo下不用等待,一回车,网页就生成了。
不过Hugo也有一些缺陷,比如说主题质量不如hexo下的好,而且因为大都是欧美的开发者,所以里面使用了大量的google元素,本地化不友好等等。
Hugo建站
初始化
下面我把自己的建站经历分享给大家。命令
1 | hugo new site blog |
然后会生成blog文件夹。首先要了解它的目录结构
1 | . |
因为Hugo的初始化只是建立了目录结构,并没有文件生成,所以它不像hexo那样开箱即用。也正是因为空目录,所以你要先下载一个主题到themes文件夹内。我用的主题是超简洁的minimal。
有了主题文件,还要在做一件事,那就是修改配置文件config.toml,加上theme = "minimal"。Hugo不同于Hexo的地方在于,hugo只有一个根目录下的配置文件,而hexo不仅有根目录下的配置文件,还有主题目录里的配置文件。一般的,Hugo的主题文件内都会有一个\exampleSite\文件夹,只要将其中的文件复制到根目录下,就可以预览网页了。没有这个文件夹的,也要把主题内的配置文件内容复制到根目录的config.toml中。
写作
hugo也提供了hexo类似的方式新建文章
1 | hugo new posts/my-first-post.md |
这样就会在content/posts/下生成my-first-post.md文件。不够我不建议用这样的方式新建文章,因为在hugo下不同的主题可能使用不同的目录来存放文章,比如我用的minimal,它content中只有post、project两个文件夹,而post才是我们日常写文章的存放文件夹。并且hugo必须指定路劲,如果直接用hugo new my-first-post.md文件将生成在content/中,不是像hexo那样生成在source/_posts/中。路径的错误会导致网页跟预期的效果不一样。
所以,我建议,选好主题后,根据主题的目录,直接在对应的目录中右键新建一个文件。还要注意文章文件名与Front Matter中的title要一致。
如果文章中有图片,要把图片放到static目录下,最好在static内新建一个与文章同名的文件夹,然后把图片放到里面,这样方便管理。在文章中加入图片
1 |  |
(注意路径前面的/)
生成
Hugo生成网页很方便。直接使用命令hugo就可以瞬间把文章渲染成网页。另外还有一个非常方便的功能是,hugo内置了网页服务器(都是因为go语言的好处),你可以使用命令hugo server开启服务器,然后就可以使用浏览器查看效果了http://localhost:1313/。并且工程内任何的文件改动都会实时更新预览,这个比起hexo简直方便多了。
部署
hugo也提供了一些自动部署的工具,我推荐一个通用的方法,使用Rsync方式部署。rsync 是开源的文件增量传输软件,可以用来进行文件的远程复制与备份。
使用命令
1 | hugo && rsync -avz --delete public/ user@host:~/www/ |
就可以将文章渲染成网页并同步到host远程主机。
我用的方式为码云的page服务,将hugo工程托管到码云后,page服务会替你生成网页并给你一个网页空间。具体实现步骤是先在码云上建立一个工程,将hugo上传到工程,然后再服务里找到page按照要求填写一下就可以了,如图
值得一提的是,码云很好用,page支持Jekyll、Hugo、Hexo三种静态博客框架。