Awesome

Gravity Web UI packages monorepo

"Gravity UI Web monorepo" banner image

Lerna monorepo containing Gravity design system NPM packages relating to Web UIs:

Gravity UI Web: The core SASS/CSS library used by all Gravity-powered web projects.
Gravity UI Nunjucks: Nunjucks HTML templates for Gravity UI components. Also used to generate our living pattern library.
Custom Semantic Release helpers:

Development

Initial setup

After an initial clone, or if any of the packages' dependencies have changed you should run the following in the repo's root directory:

npm install
npm lerna:bootstrap

This will install dependencies for all packages in the repo and configure any local cross-references between them.

Local dev

Typically, updating Gravity involves changing multiple packages - e.g. adding or modifying Nunjucks templates in gravity-ui-nunjucks while also editing the corresponding SASS code in gravity-ui-web. The most convenient way to work is therefore to run the following in the repo's root directory:

npm start

This will:

Build the gravity-ui-web UI library and begin watching its source files for changes (triggering a rebuild whenever they do)
Build and launches the gravity-ui-nunjucks pattern library locally (opens in your default browser automatically) and begins watching its source files for changes. Updates to the UI library will also trigger an automatic refresh of the pattern library.

Making commits

This project uses Commitizen for commit formatting. Please use the following command after git add to properly check in files. Commits not checked in this way may cause your PR to be rejected.

npm run commit

(alternatively you can run: npx git-cz which does the exact same thing)

Releases

This project is a Lerna monorepo composed of several sub-packages. Everything is binded together with a custom Semantic Release pipeline configuration, which enables our CI to automatically make releases whenever changes are merged into the master branch. To use the newly created release simply point your app's package.json to use the new version that's just been created.