+++
title=”docker+hugo+git搭建博客”
date=”2017-09-30”
tags=[“docker”,”hugo”,”git”]
categories=[“资源管理”]
description=”简单介绍一下搭建过程，和搭建过程中遇到的坑”
featured=true
image=”img/201709/zhiwu1.jpg”
+++

hugo镜像

下面是我制作的hugo镜像的dockerfile文件，犹豫hugo安装下载太慢，所以先下载到了本地，然后再ADD，

FROM debian:jessie
MAINTAINER lastsweetop@163.comRUN apt-get -qq update \&& DEBIAN_FRONTEND=noninteractive apt-get -qq install -y --no-install-recommends python-pygments git ca-certificates asciidoc \&& rm -rf /var/lib/apt/lists/*# Download and install hugo
ENV HUGO_VERSION 0.29
ENV HUGO_BINARY hugo_${HUGO_VERSION}_Linux-64bit.deb# ADD https://github.com/gohugoio/hugo/releases/download/v${HUGO_VERSION}/${HUGO_BINARY} /tmp/hugo.deb
ADD hugo_0.29_Linux-64bit.deb /tmp/hugo.debRUN dpkg -i /tmp/hugo.deb \&& rm /tmp/hugo.deb# Create working directory
WORKDIR /usr/share/RUN hugo new site blogWORKDIR /usr/share/blog# RUN hugo gen chromastyles --style=monokai > static/syntax.css# By default, serve site
ENV HUGO_BASE_URL "http://localhost:1313"
ENV HUGO_THEME hyde
# CMD hugo server -b ${HUGO_BASE_URL} --bind="0.0.0.0" -p 80
CMD hugo --theme=${HOGO_THEME} --baseUrl=${HUGO_BASE_URL}

然后通过docker build -t xxxxxxxxx/hugo .命令生成镜像，然后docker push xxxxxxxxx/hugo到库中

工程目录

先要建好自己的工程目录，在之后的开发中使用，

├── content      //文章目录
├── themes          //样式目录
├── static          //静态资源
├── public      //最终生成的静态网站
├── config.toml   //hugo站点的配置文件
├── stack-blog.yml   //运行环境的stack
└── stack-lastsweetop.yml   //开发环境的stack

hugo站点的配置文件

contentDir = "content"
layoutDir = "layouts"
publishDir = "public/blog"
buildDrafts = false
baseURL = ""
canonifyURLs = true
title = "独自登高楼 望断天涯路"
themesDir =                   "themes"
theme =                       "hugo-theme-bleak"[taxonomies]category = "categories"tag = "tags"[params]# Warning Keys are case sensitivesSubtitle = "lastsweetop的博客"description = "Everything is awesome !"cover = "/img/cover.low.jpg"logo = "/img/apple-touch-icon.png"

开发环境的stack配置

为了少敲docker命令，直接使用单机的stack模式，把开发环境单独作为一个stack，

version: "3"
services:hugo:#你之前生成好的的镜像image: xxxxxxxx/hugodeploy:replicas: 1resources:limits:cpus: "0.1"memory: 50Mrestart_policy:condition: on-failureenvironment:- HUGO_BASE_URL=http://localhost/
      - HUGO_THEME=hugo-theme-bleak  #bleak样式
    volumes:   #把之前建好的目录和文件挂在hugo的镜像下- /XXXXXXXXX/bloghugo/content:/usr/share/blog/content
      - /XXXXXXXXX/bloghugo/themes:/usr/share/blog/themes
      - /XXXXXXXXX/bloghugo/static:/usr/share/blog/static
      - /XXXXXXXXX/bloghugo/public:/usr/share/blog/public
      - /XXXXXXXXX/bloghugo/config.toml:/usr/share/blog/config.toml
    networks:- webnet
networks:webnet:

然后执行命令docker stack deploy -c stack-lastsweetop.yml hugo,就会生成最终的站点在public目录中。

运行环境的stack

那么想要站点跑起来还得使用nginx镜像制作stack，配置文件如下：

version: "3"
services:web:image: nginxdeploy:replicas: 1resources:limits:cpus: "0.1"memory: 50Mrestart_policy:condition: on-failureports:- "80:80"volumes:- /xxxxxxxx/bloghugo/public/blog:/usr/share/nginx/htmlnetworks:- webnet
networks:webnet:

至此浏览器输入http://localhost，你就可以看到你的站点了，效果和本博客一样一样的

部署到生产

部署到生产环境也相当容易的，使用git hooks，在post-update文件中，把网站check出来就可以了，记住，只用public目录就可以，

GIT_WORK_TREE=/home/blog/web git checkout -q -f

这里有坑

hugo的代码高亮有问题，于是换成了highlightjs插件，但是该插件也有坑，第一次不出来，需要刷新，改成ready方法，刷新后又不出来，只能结合一下，以下是出坑的代码：

hljs.initHighlighting()
$(document).ready(function() {$('pre code').each(function(i, e) {hljs.highlightBlock(e)});
});

Docker小技巧（五）——hugo+git搭建博客相关推荐

Nginx+Docker+Jekyll+阿里云ECS+备案搭建博客全记录
"记录本站搭建全过程,为想要自己搭建博客的朋友提供一个参考" 在我的博客网站中查看本文前言与准备 Docker Docker是一个很方便的跨平台应用容器引擎,让开发者可以打包他们 ...
git config设置用户名_hexo和git搭建博客过程
效果图手机端和电脑自动更换背景搭建自己的博客(一) 前序: 折腾了几天,搞出了git加hexo的博客(带有评论功能),再次记录一下此次搭建的过程.先看看成品: https://g-ncp.gi ...
#WordPress小技巧#纯代码为自己博客添加支付宝/微信打赏功能
原文:https://www.wn789.com/13323.html 很多人的WordPress博客在文章尾部都有打赏功能,让读者可以直接通过扫描微信.支付宝二维码进行赞助,毕竟维护博客,编写博文需 ...
hugo搭建博客教程-简单搭建
title: Hugo简单搭建博客 tags: Hugo 博客教程 categories: Hugo keywords: 'Hugo,博客教程' description: 简单的Hugo搭建博客教程, ...
使用Docker 实现微服务并搭建博客，一文全掌握
转载自使用Docker 实现微服务并搭建博客,一文全掌握 Docker 是一个容器工具,提供虚拟环境.很多人认为,它改变了我们对软件的认识. 本文,通过搭建一个博客的例子,来介绍如何使用Docke ...
html 小程序开发搭建,云开发（小程序端，web端+博客搭建部署）
小程序端云函数 const cloud = require("wx-server-sdk"); cloud.init({ env: "xly-ba27v", ...
如何用hugo 搭建博客
1,Hugo 简介搭建个人博客有很多开源的博客框架,我们要介绍的框架叫作Hugo.Hugo 是一个基于Go 语言的框架,可以快速方便的创建自己的博客. Hugo 支持Markdown 语法,我们可以 ...
8-【Git入门】个人博客搭建用hugo搭建博客连github上
由于自己搭建博客第一次踩了很多坑下面整理所有相关坑和步骤,如果出现问题多搜搜,有足够耐心就行自己搭建博客不如用现有平台因为知乎简书掘金等平台都很好兼容makedown语法自己搭建编辑文章 ...
从零开始搭建博客Hexo-Node-Git搭建博客
从零开始搭建博客第一部分,Github注册及Github Pages建立什么是 Hexo? Hexo 是一个快速.简洁且高效的博客框架.Hexo 使用 Markdown(或其他渲染引擎)解析文章,在 ...

Docker小技巧（五）——hugo+git搭建博客