Example CI configs

Code samples of my common continuous integration configuration files for GitHub Actions, CircleCI

Each snippet typically installs dependencies (with caching), runs tests and publishes new version to NPM and GitHub using semantic-release.

GitHub Actions

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
name: ci
on: push
jobs:
test:
runs-on: ubuntu-latest
steps:
- name: Checkout ๐Ÿ›Ž
uses: actions/[email protected]

- name: Install NPM dependencies ๐Ÿ“ฆ
uses: bahmutov/[email protected]

- name: Run tests ๐Ÿงช
run: npm test

- name: Show GitHub variables ๐Ÿ“Š
run: npm run github-demo

- name: Semantic Release ๐Ÿš€
uses: cycjimmy/[email protected]
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

Example repositories print-env, make-empty-github-commit.

Read more about GitHub Actions in Trying GitHub Actions blog post. If you are doing Cypress End-to-end tests, I recommend using Cypress GitHub Action.

Tip: when using NPM module caching, Do Not Let NPM Cache Snowball on CI.

CircleCI

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
version: 2.1
orbs:
# Circle Node orb makes it simple to cache dependencies
# https://circleci.com/orbs/registry/orb/circleci/node
node: circleci/[email protected]
jobs:
build:
executor:
name: node/default
tag: '12'
steps:
- checkout
- node/with-cache:
steps:
- run:
name: install dependencies ๐Ÿ“ฆ
command: npm ci
- run:
name: run tests ๐Ÿงช
command: npm run e2e
- run:
name: NPM publish ๐Ÿš€
command: npm run semantic-release

Example repositories term-to-html

If you are doing Cypress End-to-end tests, I recommend using Cypress CircleCI Orb

Tip: form the CircleCI project badge URL using https://circleci.com/docs/2.0/status-badges/

Emoji

In the code samples above I am using emoji to quickly see each step.

Emoji Step

๐Ÿ›Ž

Code check out from the repo

๐Ÿ“ฆ

Installing and caching dependencies

๐Ÿงน

Linting source code

๐Ÿงฉ

Checking types, for example using tsc --noEmit

๐Ÿ’…

Running Prettier formatter

๐Ÿšฆ

Some sanity check before continuing

๐Ÿ—

Building application

๐Ÿš›

Moving or preparing application

๐Ÿ—‘

Delete file or folder

๐Ÿงช

Running tests

๐Ÿ’จ

Running smoke tests

๐Ÿ“Š

Running a demo step

๐Ÿ“ˆ

Check code coverage

๐Ÿš€

Releasing a new version

Here is how it looks in GitHub Actions

Emoji in GitHub Actions

Note: please do not use emoji in the job names - otherwise your GitHub commit status checks will stop working.