The monorepo for Dialpad's design system Dialtone.
The @dialpad/dialtone repository is a monorepo composed of independently released Dialtone NPM packages.
The following is a list of packages included in this monorepo. Note that libraries (packages folder) are separated from apps (apps folder):
dialtone/
|--- .github # Github configuration and workflows
|--- apps # Apps
|--- dialtone-documentation # Documentation site
|--- packages # NPM packages
|--- dialtone # Dialtone CSS library
|--- dialtone-icons # Dialtone SVG icons library
|--- dialtone-tokens # Dialtone tokens library
|--- eslint-plugin-dialtone # Custom ESLint rules for Dialtone users
|--- scripts # Shared scripts
- We use pnpm for managing workspaces
If you do not have pnpm installed, you can install it with:
npm install -g pnpm
- We use Nx as build system for improved speed and easier monorepo administration. nx is installed as a dev dependency in the root of the project.
Once pnpm is installed, in the monorepo root run:
pnpm install
This will install the dependencies for all packages.
In order to run dialtone locally, you can use:
# This will start the server for the documentation site and the library so it is live updated with any changes.
pnpm run start:dialtone
Access the local server at http://localhost:4000
Use the --filter
flag to run commands
for a specific package or app.
pnpm add <dependency> --filter <package/app>
To install a local dependency, just add the --workspace
flag
pnpm add <dependency> --filter <package/app> --workspace
You can run commands like build
, test
, start
from
the root of the project with:
npx nx <command> <package/app>
Example:
npx nx build dialtone-documentation
pnpm run release
This will automatically release all packages that need to be released.