Demo

Did you know?

This entire documentation site is using starlight-package-managers to display commands so do not hesitate to check out the various pages.

After installing the package, you can use the component provided by starlight-package-managers in any MDX files of your Starlight documentation site.

src/content/docs/example.mdx

import { PackageManagers } from 'starlight-package-managers'

<PackageManagers pkg="astro" />

The code above generates the following commands:

npm

npm i astro

yarn

yarn add astro

pnpm

pnpm add astro

Package manager tabs are also synced between each instance on the same page.

npm

npm create astro@latest -- --template starlight

yarn

yarn create astro@latest --template starlight

pnpm

pnpm create astro@latest --template starlight