Skip to main content
If you’re looking for information on how to integrate the SDK, check out ourUniversal Checkout integration guide.
Please review the Content Security Policy (CSP) recommendations before installing!
Our Web SDK is available on npm under the name @primer-io/checkout-web. This package includes TypeScript definitions.
BASH
# with yarn
yarn add @primer-io/checkout-web

# with npm
npm i @primer-io/checkout-web
Then import Primer in your application
TS
import { Primer } from "@primer-io/checkout-web";

// for example
Primer.showUniversalCheckout(clientToken, {
  /* options */
});

​
With our CDN

Include the Primer.min.js script on the page where you want the checkout to be rendered. Ensure that you’re providing the desired version in the script tag. For example, using v2.54.0:
HTML
<link rel="stylesheet" href="https://sdk.primer.io/web/v2.64.6/Checkout.css" />

<script
  src="https://sdk.primer.io/web/v2.64.6/Primer.min.js"
  integrity="sha384-uHhZVkvTCX4hgjpQWd8pQEdRJlGGDx7S0Bb4dpzJGVXdYMyRUHnK5waT4rjhtEsT"
  crossorigin="anonymous"
></script>

​
Version pinning

The CDN URL includes a specific version number (e.g. v2.64.4). Each version is locked with an integrity hash, so the script loaded in production is always exactly the one you tested with. This means no unexpected changes between deployments. To upgrade, update the version number and integrity hash in your script tag. You can find the latest version and release notes in the Web SDK changelog. Primer.min.js will add the Primer object to the global scope.
TS
const { Primer } = window;

// for example
Primer.showUniversalCheckout(clientToken, {
  /* options */
});