Skip to main content

Tools published on npm

There is a special support for tools that can be installed through npm.

Let's take the TypeScript compiler as an example. Add a compileCode language entry that will run all ts code section through the tsc node executable.

By default, the tool generates a unique folder and write the source as input.ts, and the options as options.json. The tool is executed within the generated folder and can tune how your tool is called in the options.

./docusaurus.config.js
compileCode: {
langs: [
...,
{
lang: "ts",
nodeBin: "tsc",
inputFiles: {
"tsconfig.json": {
"compilerOptions": {
"target": "esnext",
"skipLibCheck": true,
"lib": ["esnext", "dom"]
},
"include": [
"input.ts"
]
}
}
},
];
}

Let's take a look at this example in action.

```ts showLineNumbers ignoreErrors
console.llog('typo!');
```

When rendered in the docs, this snippet looks like any other code snippet. But you'll also notice an additional box underneath with the TypeScript compiler output. This output was computed at build time.

http://localhost:3000
console.llog('typo!');
Output
input.ts(1,9): error TS2551: Property 'llog' does not exist on type 'Console'. Did you mean 'log'?