Getting started for developers

Get started using the VA Clinical Design System (VACDS) by installing the @department-of-veterans-affairs/clinical-design-system package.

Get started

While our VACDS inherits styles and components from the U.S. Web Design System and VA.gov Design System, the VACDS specifically focuses on providing additional components and styles for clinician-facing applications.

Prerequisites

1. Create a Github Personal Access Token

In order to use a package from the Github package registry, you need a personal access token (classic).

Follow the documentation to make a personal access token in your personal Github account: Github Personal Access Token Classic

Select the following scope for your token:

Make sure to copy the token generated for the next step

2. Authenticate with your Github Personal Access Token

Create a ~/.npmrc file in your terminal if it doesn’t already exist.

Replace YOUR_TOKEN_HERE with the Github Personal Access Token you copied from the previous step.

# ~/.npmrc

//npm.pkg.github.com/:_authToken=YOUR_TOKEN_HERE

For reference: Github Authenticating with Personal Access Token

3. Tell npm or yarn to use the Github Package Registry

VACDS packages are currently hosted on Github Package Registry, not the NPM Registry. We need to let our package managers know where the VACDS packages can be downloaded from.

Create a .npmrc file at your repo’s root directory.

# ./.npmrc

@department-of-veterans-affairs:registry=https://npm.pkg.github.com/