TypeScript
Nextra is built with TypeScript and provides excellent TypeScript support out of the box. This guide will help you leverage TypeScript in your Nextra project.
Getting Started
To use TypeScript in your Nextra project, you need to:
Install TypeScript and types packages as devDependencies
npm i -D typescript @types/react @types/nodetsconfig.json
You can manually create a tsconfig.json file in the root of your project or
rename the extension of some of the existing files to .ts or .tsx and then
Next.js will detect TypeScript in your project and create a tsconfig.json file
for you.
Type Definitions
Nextra provides type definitions for distribution code for its components and
configurations. You can leverage these types by renaming your theme
configuration file to .ts or .tsx extension and importing a theme config
type, e.g. for nextra-theme-docs:
import type { DocsThemeConfig } from 'nextra-theme-docs'
const config: DocsThemeConfig = {
// Your theme configuration
}
export default configBy leveraging TypeScript in your Nextra project, you can catch errors early, improve code quality, and enhance the developer experience with better autocompletion and type inference.