How to use Travis CI environment variables + .sh script for auto deployment to Github Pages?
I'm trying to simplify my Github + Travis CI workflow w/ 2 environment variables
GH_TOKEN
+GH_REF
stored in.travis.yml
... used by
git clone "https://${GH_TOKEN}@${GH_REF}" --single-branch
Your script can use the TRAVIS_REPO_SLUG
environment variable referenced in the documentation
I managed to do EVERYTHING I wanted to.
My Goals
- Automating
GH_REF
value ingpages_build.sh
script w/ theTRAVIS_REPO_SLUG
(thanks for the tip @osowskit !) - Writing
git update-index --chmod=+x gpages_build.sh
once and storing it into it's own repo...when needing it, justbower install
it!
✔ The Process
Here's my exact approach I took for creating and testing <custom-elements>
w/ Travis CI and auto deploying to Github Pages after a successful build.
gpages_build.sh (script):
- In order to move away from having to make my script executable inside every project w/ the
git update-index --chmod=+x gpages_build.sh
command, I needed to centralize this process inside one handy Github repo (oneezy/build-tools). The benefits of this are:- Only having to make the script executable once
- Being able to update the script as needed in one place (not every repo)
- Ensuring that when others clone the project, they'll always have the executable file
- In order to make the
GH_REF
variable automatic and not have to write it out each time, Travis CI gives us theTRAVIS_REPO_SLUG
variable, which is basicallyusername/repo
for whatever Github Repository you're working in. You write it out like this:GH_REF="github.com/${TRAVIS_REPO_SLUG}"
```
# This script pushes a demo-friendly version of your element and its# dependencies to gh-pages.# usage gp Polymer core-item [branch]# Run in a clean directory passing in a GitHub org and repo nameGH_REF="github.com/${TRAVIS_REPO_SLUG}"org=`echo ${TRAVIS_REPO_SLUG} | cut -f 1 -d /`repo=`echo ${TRAVIS_REPO_SLUG} | cut -f 2 -d /`name="Travis CI"email="builds@oneezy.com"branch=${3:-"master"} # default to master when branch isn't specifiedmkdir temp && cd temp# make folder (same as input, no checking!)mkdir $repogit clone "https://${GH_TOKEN}@${GH_REF}" --single-branch# switch to gh-pages branchpushd $repo >/dev/nullgit checkout --orphan gh-pages# remove all contentgit rm -rf -q .# use bower to install runtime deploymentbower cache clean $repo # ensure we're getting the latest from the desired branch.git show ${branch}:bower.json > bower.jsonecho "{ \"directory\": \"components\"}" > .bowerrcbower installbower install $org/$repo#$branchgit checkout ${branch} -- demorm -rf components/$repo/demomv demo components/$repo/# redirect by default to the component folderecho "<META http-equiv="refresh" content=\"0;URL=components/$repo/\">" >index.htmlgit config user.name $namegit config user.email $email# send it all to githubgit add -A .git commit -am 'Deploy to GitHub Pages'git push --force --quiet -u "https://${GH_TOKEN}@${GH_REF}" gh-pages > /dev/null 2>&1popd >/dev/null
```
Travis.yml Configuration:
One GOTCHA that was throwing me off here was the
GH_TOKEN
variable, which is the Personal Access Token you need from Github for read/write ability to your repositories. Due to the power this token has, I needed to encrypt it w/ the Travis CLI (Travis Command Line Tool).travis encrypt GH_TOKEN=********* --add
, which will automatically add the encrypted variable to your.travis.yml
file. I was under the impression that I could use the same encryptedGH_TOKEN
for every repo, but I found out the hard way that's not the case. When you encrypt anything w/ Travis, it appears that you're essentially tieing that encryption to the repository you're in, E.G.: you musttravis encrypt GH_TOKEN=********* --add
inside every repository. One possible workaround would be to configure an alias/ command inside aconfig
file w/ this information stored inside, but I haven't yet explored the theory.The next thing to do is
bower install -s gpages_build.sh
script and run it from.travis.yml
w/./bower_components/build-tools/gpages_build.sh
. This will automatically pull the script from ourbuild-tools
repo and run it.
```
language: node_jsnode_js: stablesudo: requireddist: trustyaddons: firefox: latest apt: sources: - google-chrome packages: - google-chrome-stablecache: directories: - node_modules - "$HOME/.cache/bower"install:- npm install -g bower polymer-cli- npm install- bower installscript:- xvfb-run polymer testafter_success:- if [ ${TRAVIS_PULL_REQUEST} = "false" ] && [ "$TRAVIS_BRANCH" = "master" ]; then bower install -s oneezy/build-tools && ./bower_components/build-tools/gpages_build.sh; fi# DO EVERY TIME: # travis encrypt GH_TOKEN=**************** --add # env:# global:# secure: ZwNuFN1cryC5dff4c3a1qePkoRZoug+HDiN55dFATTt7Opk20C8SgO+RGEWqYWelFkUN2jhAyoJ91GFMxOyYqbqZP+mQfBaFWgBZoKIcGcDur5in4z6ZaWfw65X03K0HIaaKaunpO4C1d/d++zMhqvudhaJ4JgXJXts5cUdmXGxCIEhKE+mH5d76VK4fbpyrtpewllqHeaiIE88oFZ0L8xQP8K7SUXukvVmE1Re0Kl0UjXjsdSUftcj+gnOcBxqGjVlSjQ9Bk0zmP+2nHYo8Gx=
```