With our library now published to our internal package registry, we can consume our component library in another application. To test this functionality we will be replacing the demo elements within the demo-styleguide codebase.

Since our library isn't available in the public NPM registry we will need to configure our local environment to authenticate with GitHub.

NPM configuration#

Within the demo-styleguide codebase, add a new .npmrc file with the following content.

cd ./demo-styleguide

touch .npmrc

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

@GITHUBUSERNAME:registry=https://npm.pkg.github.com

IMPORTANT: Ensure that @GITHUBUSERNAME is updated to match your GitHub organization or account name. For my library this will be @austingreendev. This config ensures that any @GITHUBUSERNAME/* packages are retrieved with the GitHub registry while all others use the public NPM registry.

Once the configuration file is created we must create a new Personal Access Token to authenticate with GitHub. This token should only contain the read:packages scope.

Once created, update ACCESS_TOKEN with this provided value. Ensure that .npmrc is added to your .gitignore so that our secret is not added to source control.