hugo-最好用的静态网站生成器
hugo最好用的静态网站生成器
Hugo是由Go语言实现的静态网站生成器。简单、易用、高效、易扩展、快速部署。
快速开始
安装Hugo
1. 二进制安装(推荐:简单、快速)
到 Hugo Releases 下载对应的操作系统版本的Hugo二进制文件(hugo或者hugo.exe)
Mac下直接使用 Homebrew 安装:
brew install hugo
2. 源码安装
源码编译安装,首先安装好依赖的工具:
设置好 GOPATH 环境变量,获取源码并编译:
$ export GOPATH=$HOME/go
$ go get -v github.com/spf13/hugo
源码会下载到 $GOPATH/src 目录,二进制在 $GOPATH/bin/
如果需要更新所有Hugo的依赖库,增加 -u 参数:
$ go get -u -v github.com/spf13/hugo
生成站点
使用Hugo快速生成站点,比如希望生成到 /path/to/site 路径:
$ hugo new site /path/to/site
这样就在 /path/to/site 目录里生成了初始站点,进去目录:
$ cd /path/to/site
站点目录结构:
▸ archetypes/
▸ content/
▸ layouts/
▸ static/
config.toml
创建文章
创建一个 about 页面:
$ hugo new about.md
about.md 自动生成到了 content/about.md ,打开 about.md 看下:
+++
date = "2015-10-25T08:36:54-07:00"
draft = true
title = "about"
+++
正文内容
内容是 Markdown 格式的,+++ 之间的内容是 TOML 格式的,根据你的喜好,你可以换成 YAML 格式(使用 --- 标记)或者 JSON 格式。
创建第一篇文章,放到 post 目录,方便之后生成聚合页面。
$ hugo new post/first.md
打开编辑 post/first.md :
---
date: "2015-10-25T08:36:54-07:00"
title: "first"
---
### Hello Hugo
1. aaa
1. bbb
1. ccc
安装皮肤
到 皮肤列表 挑选一个心仪的皮肤,比如你觉得 Hyde 皮肤不错,找到相关的 GitHub 地址,创建目录 themes,在 themes 目录里把皮肤 git clone 下来:
# 创建 themes 目录
$ cd themes
$ git clone https://github.com/spf13/hyde.git
运行Hugo
在你的站点根目录执行 Hugo 命令进行调试:
$ hugo server --theme=hyde --buildDrafts --watch
使用 --watch 参数可以在修改文章内容时让浏览器自动刷新。
浏览器里打开: http://localhost:1313
部署
假设你需要部署在 GitHub Pages 上,首先在GitHub上创建一个Repository,命名为:coderzh.github.io (coderzh替换为你的github用户名)。
在站点根目录执行 Hugo 命令生成最终页面:
$ hugo --theme=hyde --baseUrl="http://coderzh.github.io/"
如果一切顺利,所有静态页面都会生成到 public 目录,将pubilc目录里所有文件 push 到刚创建的Repository的 master 分支。
$ cd public
$ git init
$ git remote add origin https://github.com/coderzh/coderzh.github.io.git
$ git add -A
$ git commit -m "first commit"
$ git push -u origin master
浏览器里访问:http://coderzh.github.io/
这个网站 免费教程 就是我使用hugo生成的。 这个网站模板是我自己写的(样式部分除外),大家如果有关于hugo的以及go 模板相关的问题可以问我。
hugo-最好用的静态网站生成器的更多相关文章
- 利用git+hugo+markdown 搭建一个静态网站
利用git+hugo+markdown 搭建一个静态网站 一直想要有一个自己的文档管理系统: 可以很方便书写,而且相应的文档很容易被分享 很方便的存储.管理.历史记录 比较方面的浏览和查询 第一点用M ...
- jekyll 将纯文本转化为静态网站和博客 静态网站生成器
jekyll 将纯文本转化为静态网站和博客 静态网站生成器 这个貌似对windows 支持不是很好~ 但是有支持,官方说不建议使用
- 关于开箱即用的文档静态网站生成器VuePress
关于VuePress 一个由Vue驱动的静态文档网站生成框架,具有开箱即用的优点. 给项目添加.gitignore .gitignore是git用来排除目录的清单,我们把以下目录加入其中,以便每次操作 ...
- 使用 Java 和 Maven (JBake) 生成静态网站
使用 JBake("mvn generate-resources")构建您的静态网站或博客.使用布局.宏和数据文件. 我们迁移了整个www.optaplanner.org网站(13 ...
- 静态内容生成器——Wyam
(此文章同时发表在本人微信公众号"dotNET每日精华文章",欢迎右边二维码来关注.) 题记:今天继续静态网站的话题,介绍我选用的一个使用.NET开发的静态内容生成器--Wyam. ...
- Gatsby上手指南 - 让你的静态网站用react来高逼格的写
注意:Gatsby V2版本安装及使用问题请移步<Gastby V2安装过程中常见问题>,此文较旧,主要针对V1版Gatsby而介绍 前言 一直以来都是用之前比较流行的静态网站生成器Hex ...
- [技术翻译]使用Nuxt生成静态网站
本周再来翻译一些技术文章,本次预计翻译三篇文章如下: 04.[译]使用Nuxt生成静态网站(Generate Static Websites with Nuxt) 05.[译]Web网页内容是如何影响 ...
- ECS7天实践进阶训练营Day1:使用阿里云ECS,快速搭建、管理VuePress静态网站
一.概述 VuePress是2018年由尤雨溪发布的一个全新的基于Vue的静态网站生成器,它是一个非常轻量级的静态网站生成器.VuePress主要用于生成技术文档,其类似于Gitbook,我们可以用于 ...
- [tools]hugo&github构建静态网站/百度统计
hugo/github构建网站基本原理 1.hugo是一个静态化的工具,你写md,然后他把md转换成对应样式的html, 2.并给html嵌入百度统计的script.然后你将html放到github上 ...
随机推荐
- Effective Java 38 Check parameters for validity
For public methods, use the Javadoc @throws tag to document the exception that will be thrown if a r ...
- 【转】PaxosLease算法--2PC看Paxos选主
原文请参考[[置顶] Paxos master选举--PaxosLease算法] 众所周知,为了避免Paxos算法的活锁问题,必须选举唯一的proposor.偏偏在Paxos原论文中,作者L. Lam ...
- 本人常用的Linux bash快捷键(持续更新)
按使用频率由高到低排列: Ctrl + a :移到命令行首Ctrl + e :移到命令行尾 Ctrl + u :从光标处删除至命令行首Ctrl + k :从光标处删除至命令行尾 Ctrl + d :删 ...
- poj 2195 KM算法
题目链接:http://poj.org/problem?id=2195 KM算法模板~ 代码如下: #include "stdio.h" #include "string ...
- D_S 循环队列的基本操作
// main.cpp #include <iostream> using namespace std; #include "Status.h" typedef in ...
- ArcGis 10+Oracle发布WFS-T服务,无法更新Feature的解决方法
现象: 前端采用Openlayers,更新Feature时服务器端返回的XML提示更新错误 原因: 参考:http://support.esri.com/en/knowledgebase/techar ...
- [转]轻松学习Ionic (四) 修改应用图标及添加启动画面(更新官方命令行工具自动生成)
本文转自:http://blog.csdn.net/zapzqc/article/details/42237935 由于Ionic更新了命令行工具,以后修改应用图标和添加启动画面就简单了,最新方法见最 ...
- sass揭秘之变量(转载)
出处:http://www.w3cplus.com/preprocessor/sass-basic-variable.html 因为文章内含有很多sass代码,如需自己动手查看编译结果,推荐使用sas ...
- jquery/js实现验证聚焦,失焦
jquery实现验证聚焦,失焦方法: 我还是喜欢用jquery来实现,不管页面中多少个输入框需要实现聚焦,失焦,都公有,我常用的方法是: 遍历该页面中的input框,获取输入框中的val值,当该输入框 ...
- Codeforces Round #253 Div2 D.Andrey and Problem 概率+贪心
概率计算:P(某set) = 令: 和 现在考虑: 1.考虑某个集合,再加一个概率为Pi的朋友后能不能使总概率提高. 即: 由公式可知, 如果 S < 1,则delta > 0,则 ...