Configuring CI Using GitLab and Nx

Nx is a smart, fast and extensible build system, and it works really well with monorepos. Monorepos provide a lot of advantages:

  • Everything at that current commit works together. Changes can be verified across all affected parts of the organization.
  • Easy to split code into composable modules
  • Easier dependency management
  • One toolchain setup
  • Code editors and IDEs are "workspace" aware
  • Consistent developer experience
  • And more ...

But they come with their own technical challenges. The more code you add into your repository, the slower the CI gets.

Setting Gitlab CI/CD

Below is an example of a GitLab pipeline setup for an Nx workspace only building and testing what is affected.

1image: node:16
2
3stages:
4  - test
5  - build
6
7.distributed:
8  interruptible: true
9  only:
10    - main
11    - merge_requests
12  cache:
13    key:
14      files:
15        - package-lock.json
16    paths:
17      - .npm/
18  before_script:
19    - npm ci --cache .npm --prefer-offline
20    - NX_HEAD=$CI_COMMIT_SHA
21    - NX_BASE=${CI_MERGE_REQUEST_DIFF_BASE_SHA:-$CI_COMMIT_BEFORE_SHA}
22  artifacts:
23    paths:
24      - node_modules/.cache/nx
25
26workspace-lint:
27  stage: test
28  extends: .distributed
29  script:
30    - npx nx workspace-lint --base=$NX_BASE --head=$NX_HEAD
31
32format-check:
33  stage: test
34  extends: .distributed
35  script:
36    - npx nx format:check --base=$NX_BASE --head=$NX_HEAD
37
38lint:
39  stage: test
40  extends: .distributed
41  script:
42    - npx nx affected --base=$NX_BASE --head=$NX_HEAD --target=lint --parallel=3
43
44test:
45  stage: test
46  extends: .distributed
47  script:
48    - npx nx affected --base=$NX_BASE --head=$NX_HEAD --target=test --parallel=3 --ci --code-coverage
49
50build:
51  stage: build
52  extends: .distributed
53  script:
54    - npx nx affected --base=$NX_BASE --head=$NX_HEAD --target=build --parallel=3

The build and test jobs implement the CI workflow using .distributed as template to keep CI configuration file more readable.

Distributed CI with Nx Cloud

A computation cache is created on your local machine to make the developer experience faster. This allows you to not waste time re-building, re-testing, re-linting, or any number of other actions you might take on code that hasn't changed. Because the cache is stored locally, you are the only member of your team that can take advantage of these instant commands. You can manage and share this cache manually.

Nx Cloud allows this cache to be shared across your entire organization, meaning that any cacheable operation completed on your workspace only needs to be run once. Nx Cloud also allows you to distribute your CI across multiple machines to make sure the CI is fast even for very large repos.

Learn more about configuring your CI environment using Nx Cloud with Distributed Caching and Distributed Task Execution in the Nx Cloud docs.