Hugo是最受欢迎的开源静态站点生成器之一。凭借其惊人的速度和灵活性,Hugo再次使构建网站变得有趣。

Hugo的安装及配置

步骤 一、安装 Hugo

转到Hugo Download 并下载适用于您的操作系统和体系结构的版本。将其安装在特定的位置,因为我们将在下一步中使用它。

参考文档 快速开始

步骤二、生成站点并新建文章

  1. 生成站点到/path/to/site路径
  2. 进入site目录
  3. 创建一篇文章README.mdcontent/post
  4. 生成页面
  5. 打开浏览器并在地址栏中输入 http://localhost:1313 进行查看

对应的命令:

$ hugo new site /path/to/site
$ cd /path/to/site
$ hugo new post/README.md
$ hugo server --buildDrafts
    
                       | EN  
    +------------------+----+
      Pages            | 47  
      Paginator pages  |  7  
      Non-page files   |  0  
      Static files     |  1  
      Processed images |  0  
      Aliases          | 16  
      Sitemaps         |  1  
      Cleaned          |  0  
    
    Total in 33 ms
    Watching for changes in /home/molun/myblog/{content,data,layouts,static,themes}
    Watching for config changes in /home/molun/myblog/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

至此,一个新的站点已创建完成.

步骤三、安装皮肤

Hugo 主题挑选并下载适合的主题,这里以m10c主题为例:

$ cd site/    
$ git clone https://github.com/vaga/hugo-theme-m10c.git themes/m10c
$ #在你的站点根目录执行 Hugo 命令进行调试:
$ hugo server --theme=m10c --buildDrafts
$ #(注明:v0.15 版本之后,不再需要使用 --watch 参数了)

如果想要简介演示的主题颜色,你可以看到m10c/exampleSite/ config.toml文件。

步骤四、部署站点

*按Ctrl+C停止Hugo服务进程

假设你需要部署在 GitHub Pages 上,首先在GitHub上创建一个Repository,命名为:molun01.github.iomolun01替换为你的github用户名)。

在站点根目录执行Hugo命令生成最终页面:

$ hugo --theme=hyde --baseUrl="https://molun01.github.io/"

如果一切顺利,所有静态页面都会生成到site/public/下,将pubilc目录里所有文件push到刚创建的Repositorymaster分支。

注意:GitHub Pages只能从master分支部署

$ cd public
$ git init
$ git remote add origin https://github.com/molun01/molun01.github.io.git
$ git add -A
$ git commit -m "first commit"
$ git push -u origin master

浏览器里访问:https://molun01.github.io/

步骤 5. 祝你玩的开心Y(_)Y

学习新东西的最好方式就是去玩它。