一步一步教你用hugo搭建博客

mync 9年前

Hugo 是一个轻量级的静态网站生成工具，是基于GO语言的模版技术开发而成，因为最近在学习go，就花了时间研究了下，一研究就喜欢上了。 再加上最新wordpress版本有严重的问题，在文章发表后或者再次编辑时，编辑框会丢失所有的格式，这个让使用Markdown的人无法接受。

安装hugo

Hugo官方主页：HUGO hugo托管在github上，我们可以直接二进制安装也可以源码安装。 这里我们演示源码安装。

  1. 源码安装 在go里面我们可以直接通过get安装：
    go get -u -v github.com/spf13/hugo
    或者直接git下载
    git clone https://github.com/spf13/hugo.git

  2. 编译 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

生成静态站点

  1. 创建网站 我们先创建一个空网站. 

    $ 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。

  2. 安装theme 我们可以从hugo的网站下载自己喜欢的theme
    $ cd themes $ git clone https://github.com/spf13/hyde.git

  3. 测试框架 安装完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
    hide 默认界面

  4. 发表文章 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的规范就可以。
    第一篇文章演示

调试部署

  1. 调试 在开发的过程中，我们需要不断的修改验证，所以hugo支持LiveReload功能，用户修改后，可以实时看到效果。执行hugo server命令时加上-w选项，hugo就可以自动检测本地站点文件的变更。
    $ hugo server －w -t hyde
    注意：在使用server命令时，hugo并没有在public目录下产生相应的静态页面。

  2. 部署 部署时，我们需要生成静态页面文件，然后就可以随便部署在自己的空间上了。转化时，一个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！


来自：http://www.goodmemory.cc/一步一步教你用hugo搭建博客/