Hugo 是一个轻量级的静态网站生成工具,是基于GO语言的模版技术开发而成,因为最近在学习go,就花了时间研究了下,一研究就喜欢上了。
再加上最新wordpress版本有严重的问题,在文章发表后或者再次编辑时,编辑框会丢失所有的格式,这个让使用Markdown的人无法接受。
安装hugo
Hugo官方主页:HUGO
hugo托管在github上,我们可以直接二进制安装也可以源码安装。
这里我们演示源码安装。
-
源码安装
在go里面我们可以直接通过get安装:
go get -u -v github.com/spf13/hugo
或者直接git下载
git clone https://github.com/spf13/hugo.git -
编译
go build -o hugo main.go
mv hugo $GOPATH/bin
终端查看是否成功,mac下可能出现路径没找到的问题,要重新开终端
$ hugo version
Hugo Static Site Generator v0.16-DEV BuildDate: 2015-12-14T16:07:24+08:00
生成静态站点
- 创建网站
我们先创建一个空网站.
$ hugo new site localhost $ tree . ├── archetypes ├── config.toml ├── content ├── data ├── layouts ├── public ├── static └── themes
默认情况下这些目录都是空的,直接运行的话会有ERROR提示
ERROR: 2015/12/14 ============================================================= ERROR: 2015/12/14 Your rendered home page is blank: /index.html is zero-length ERROR: 2015/12/14 * Did you specify a theme on the command-line or in your ERROR: 2015/12/14 "config.toml" file? (Current theme: "") ERROR: 2015/12/14 * For more debugging information, run "hugo -v" ERROR: 2015/12/14 =============================================================
看提示说是没有指定theme导致,我们需要下载一个theme。
-
安装theme
我们可以从hugo的网站下载自己喜欢的theme
$ cd themes
$ git clone https://github.com/spf13/hyde.git -
测试框架
安装完theme后,我们体验下效果,使用 hugo server就可以起一个http server,默认监听在1313端口,如果没有在config中配置theme,就要指定theme。
$ hugo server -t hyde 0 draft content 0 future content 0 pages created 0 paginator pages created 0 tags created 0 topics created in 24 ms Watching for changes in /Users/alex/run/localhost/{data,content,layouts,static,themes} Serving pages from memory Web Server is available at http://localhost:1313/ (bind address 127.0.0.1) Press Ctrl+C to stop
- 发表文章
hugo里面写文章其实就是写markdown文档了。写好文档,hugo会给你自动转成html静态文件。我们通过Hugo创建一个md文档。
$ hugo new first.md
/Users/alex/run/localhost/content/first.md created
运行时在网站根目录下运行,创建的文件默认创建在content目录下。
+++ date = "2015-12-15T22:35:22+08:00" draft = true title = "first" +++
我们从内容看默认创建的是草稿类型,需要将draft改为true才能看到页面。正常情况下我们会通过Mou或者github编辑文档,只要文件头符合hugo的规范就可以。
调试部署
-
调试
在开发的过程中,我们需要不断的修改验证,所以hugo支持LiveReload功能,用户修改后,可以实时看到效果。执行hugo server命令时加上-w选项,hugo就可以自动检测本地站点文件的变更。
$ hugo server -w -t hyde
注意:在使用server命令时,hugo并没有在public目录下产生相应的静态页面。 -
部署
部署时,我们需要生成静态页面文件,然后就可以随便部署在自己的空间上了。转化时,一个hugo命令就搞定:
$ hugo -t hyde 0 draft content 0 future content 1 pages created 0 paginator pages created 0 topics created 0 tags created in 38 ms
我们看到有一个页面生成了,默认在public目录,实际一起生成的还有其他文件:
$ ls 404.html first apple-touch-icon-144-precomposed.png index.html css index.xml favicon.png sitemap.xml
把这些文件放到你的空间,你就可以看见你的页面和theme了。
到这里,我们已经有了一个基本的能创建文章并且显示的网站了。
have fun!