mirror of
https://github.com/facebook/docusaurus.git
synced 2025-08-03 16:59:06 +02:00
chore(v2): tighten up the TypeScript onboarding (#3244)
* Tighten up the TypeScript onboarding * Extend the API to cover everything used in the classic theme * Wrap up internal TS support
This commit is contained in:
parent
a4c8a7f55b
commit
33ecc4bb17
7 changed files with 65 additions and 22 deletions
|
@ -5,37 +5,22 @@ title: TypeScript Support
|
|||
|
||||
## Setup
|
||||
|
||||
Docusaurus supports writing and using TypeScript theme components. To start using TypeScript, add `@docusaurus/module-type-aliases` to your project:
|
||||
Docusaurus supports writing and using TypeScript theme components. To start using TypeScript, add `@docusaurus/module-type-aliases` and some `@types` dependencies to your project:
|
||||
|
||||
```bash
|
||||
npm install --save-dev typescript @docusaurus/module-type-aliases
|
||||
npm install --save-dev typescript @docusaurus/module-type-aliases @types/react @types/react-router-dom @types/react-helmet @tsconfig/docusaurus
|
||||
```
|
||||
|
||||
Then add `tsconfig.json` to your project root with following content:
|
||||
Then add `tsconfig.json` to your project root with the following content:
|
||||
|
||||
```json title="tsconfig.json"
|
||||
{
|
||||
"compilerOptions": {
|
||||
"allowJs": true,
|
||||
"esModuleInterop": true,
|
||||
"jsx": "react",
|
||||
"lib": ["DOM"],
|
||||
"noEmit": true,
|
||||
"noImplicitAny": false
|
||||
},
|
||||
"extends": "@tsconfig/docusaurus/tsconfig.json",
|
||||
"include": ["src/"]
|
||||
}
|
||||
```
|
||||
|
||||
Docusaurus doesn't use this `tsconfig.json` to compile your TypeScript. It is added just for a nicer Editor experience, although you can choose to run `tsc --noEmit` to type check your code for yourself.
|
||||
|
||||
Then add `types.d.ts` in your `src` folder with the following content:
|
||||
|
||||
```ts title="src/types.d.ts"
|
||||
/// <reference types="@docusaurus/module-type-aliases" />
|
||||
```
|
||||
|
||||
This file makes TypeScript recognize various Docusaurus specific webpack aliases like `@theme`, `@docusaurus`, `@generated`.
|
||||
Docusaurus doesn't use this `tsconfig.json` to compile your project. It is added just for a nicer Editor experience, although you can choose to run `tsc` to type check your code for yourself or on CI.
|
||||
|
||||
Now you can start writing TypeScript theme components.
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue