HUGO

My Deployment Process

Hi,

Over Christmas I started using CircleCI to deploy Hugo to Amazon S3 instead of juggling multiple repositories with GitHub Pages (and also to gain HTTPS). This weekend I setup a site using Pygments and also got the scripts to handle Hugo version upgrades.

I’m planning to write a step-by-step blog post for newbies, but right now I’m just looking for feedback . Can I make any improvements to this setup? Particularly with my bash scripts, as I’ve just been learning bash scripting as I go along.

An example deployment site is on GitHub, but I’ve also included the relevant scripts with this post.

Deployment Scripts

circle.yml

machine:
  environment:
    CIRCLE_BUILD_DIR: $HOME/$CIRCLE_PROJECT_REPONAME
    PATH: $PATH:$CIRCLE_BUILD_DIR/bin
  post:
    - mkdir -p $CIRCLE_BUILD_DIR/bin

dependencies:
  pre:
    - bash ./ci-install-sassc.sh
    - bash ./ci-install-hugo.sh
    - go get -v github.com/nathany/s3up
  cache_directories:
    - bin

test:
  pre:
    - pygmentize -V
  override:
    - sassc sass/all.sass static/css/all.css --style compressed
    - hugo -v
  post:
    - if [ $CIRCLE_BRANCH == 'master' ]; then s3up -source=public/ -bucket=$BUCKET -key=$AWS_ACCESS_KEY_ID -secret=$AWS_SECRET_ACCESS_KEY ; fi

ci-install-sassc.sh

SASS_VERSION=3.1.0

set -x
set -e

# Install SassC if not already cached or upgrade an old version.
if [ ! -e $CIRCLE_BUILD_DIR/bin/sassc ] || ! [[ `sassc -v` =~ "sassc: ${SASS_VERSION}" ]]; then
  export SASS_BUILD_DIR=$HOME/src/github.com/sass
  mkdir -p $SASS_BUILD_DIR
  cd $SASS_BUILD_DIR

  git clone --recursive https://github.com/sass/libsass.git -b ${SASS_VERSION}
  git clone https://github.com/sass/sassc.git -b ${SASS_VERSION}

  cd sassc
  SASS_LIBSASS_PATH=$SASS_BUILD_DIR/libsass make

  cp $SASS_BUILD_DIR/sassc/bin/sassc $CIRCLE_BUILD_DIR/bin/sassc
fi

ci-install-hugo.sh

HUGO_VERSION=0.13

set -x
set -e

# Install Hugo if not already cached or upgrade an old version.
if [ ! -e $CIRCLE_BUILD_DIR/bin/hugo ] || ! [[ `hugo version` =~ v${HUGO_VERSION} ]]; then
  wget https://github.com/spf13/hugo/releases/download/v${HUGO_VERSION}/hugo_${HUGO_VERSION}_linux_amd64.tar.gz
  tar xvzf hugo_${HUGO_VERSION}_linux_amd64.tar.gz
  cp hugo_${HUGO_VERSION}_linux_amd64/hugo_${HUGO_VERSION}_linux_amd64 $CIRCLE_BUILD_DIR/bin/hugo
fi

s3up

The tool I use to copy files up to s3 is custom built. It’s called s3up:

Local Development

For local development I’m currently using Reflex as SassC doesn’t have watching built in:

watch.sh

# watch Sass and Hugo files during development
reflex -r '\.(sass|scss)$' -- sh -c 'sassc sass/all.sass static/css/all.css --style compressed' &
hugo server -D --watch && fg

Thanks, Nathan.

@nathany Thanks for this! I’ve tested your script to download hugo for a project I’m working on and it works great.

I’m not sure what the proper way to deploy Hugo on CircleCI, but this seems like a properly good way to do so. I look forward to the blog post on this, so I can point people there that have questions about doing this same thing.

Thanks again!

Glad it was helpful.

Yah, I really need to write that blog post. I’m still debating whether to keep my current setup or alter it slightly (CloudFront vs. CloudFlare, S3 vs. Google Cloud Storage).

Let us know about the conclusion – and the arguments for doing so; I have some stuff on Amazon now, but I’m not married to them …