Private NPM

Install Saas UI Pro components from a private NPM registry.

In the next steps we'll show you how to install @saas-ui/pro in new or existing projects. You'll need a valid license to install Pro, you can order one at here.

Before continuing follow these steps to set up @saas-ui/react and @chakra-ui/react in your project, if you haven't done so already.

Configuration#

All pro packages can be installed from our private NPM registry at https://npm.saas-ui.dev. After redeeming your license, an account will be automatically created.

Your NPM account is a combination of the Github username you used to redeem your license and the license code (username:licenseKey).

Configuration is slightly different for each package manager, so it's important to follow the steps for the package manager you are using in your project.

Yarn#

This configuration is for Yarn 3, if you are still using Yarn 1.2 it's highly recommended to upgrade.

In the root of your project edit .yarnrc.yml and add the following lines.

npmScopes:
saas-ui:
npmRegistryServer: 'https://npm.saas-ui.dev'
npmRegistries:
//npm.saas-ui.dev:
npmAuthIdent: '${SAAS_UI_TOKEN:-}'
npmAlwaysAuth: true

To set it up on your dev machine add this to ~/.profile or your CI configuration.

export SAAS_UI_TOKEN="GithubUsername:licenseKey"

The same configuration can be used for CI and deployments.

PNPM#

In your project root folder you can run this and enter your Github username as user and license key as password.

pnpm login --registry=https://npm.saas-ui.dev/

Manual & CI configuration.#

PNPM expects auth to be base64 encoded, so make sure SAAS_UI_TOKEN is encoded.

echo -n 'GithubUsername:licenseKey' | base64

Add your auth token to ~/.profile or your CI configuration.

export SAAS_UI_TOKEN="base64 encoded token"

If you're having troubles generating a working base64 encoded string, try this website.

Then edit .npmrc in the root of your project and add the following lines.

@saas-ui:registry=https://npm.saas-ui.dev
//npm.saas-ui.dev/:_auth="${SAAS_UI_TOKEN}"
//npm.saas-ui.dev/:always-auth=true

NPM#

In your project root folder you can run this and enter your Github username as user and license key as password.

npm login --registry=https://npm.saas-ui.dev/

Manual & CI configuration.#

Add your auth token to ~/.profile or your CI configuration.

export SAAS_UI_TOKEN="GithubUsername:licenseKey"

Then edit .npmrc in the root of your project and add the following lines.

@saas-ui:registry=https://npm.saas-ui.dev
//npm.saas-ui.dev/:_auth="${SAAS_UI_TOKEN}"
//npm.saas-ui.dev/:always-auth=true

Was this helpful?