npm install @scalar/docusaurus
Simply add to the plugins section of your Docusaurus config. If you are using Typescript you can import the type options type as well.
import type { ScalarOptions } from '@scalar/docusaurus'
plugins: [
[
'@scalar/docusaurus',
{
label: 'Scalar',
route: '/scalar',
showNavLink: true, // optional, default is true
configuration: {
spec: {
url: 'https://cdn.jsdelivr.net/npm/@scalar/galaxy/dist/latest.yaml',
},
},
} as ScalarOptions,
],
],
We wrote a detailed integration guide for Docusaurus.
Is it possible to show multiple API descriptions? Yes, it is! :)
import type { ScalarOptions } from '@scalar/docusaurus'
plugins: [
// First API definition
[
'@scalar/docusaurus',
{
// the `id` is required if you have multiple instances of the @scalar/docusaurus plugin
id: 'scalar/galaxy',
label: 'Scalar',
route: '/scalar',
showNavLink: true, // optional, default is true
configuration: {
spec: {
url: 'https://cdn.jsdelivr.net/npm/@scalar/galaxy/dist/latest.json',
},
},
} as ScalarOptions,
],
// Second API definition
[
'@scalar/docusaurus',
{
// the `id` is required if you have multiple instances of the @scalar/docusaurus plugin
id: 'petstore',
label: 'Petstore',
route: '/petstore',
showNavLink: true, // optional, default is true
configuration: {
spec: {
url: 'https://petstore3.swagger.io/api/v3/openapi.json',
},
},
} as ScalarOptions,
],
],
You can find an example in this repo under examples/docusaurus
These configuration options are a WIP as this plugin is still in beta
The label on the nav bar for this route
Path at which the API Reference will be shown
You can find the full configuration options under packages/api-reference minus theme.