TypeScript

NextraはTypeScriptで構築されており、すぐに使える優れたTypeScriptサポートを提供します。このガイドは、NextraプロジェクトでTypeScriptを活用するのに役立ちます。

はじめに

NextraプロジェクトでTypeScriptを使用するには、以下の手順が必要です。

npm i -D typescript @types/react @types/node

pnpm add -D typescript @types/react @types/node

yarn add --dev typescript @types/react @types/node

bun add --dev typescript @types/react @types/node

プロジェクトのルートにtsconfig.jsonファイルを自分で作成するか、既存ファイルの拡張子を.tsまたは.tsxに変更すると、Next.jsがプロジェクト内のTypeScriptを検出し、tsconfig.jsonファイルを作成します。

Nextraは、コンポーネントと設定の配布コード用の型定義を提供します。テーマ設定ファイルの拡張子を.tsまたは.tsxに変更し、テーマ設定型（例：nextra-theme-docs）をインポートすることで、これらの型を利用できます。

theme.config.tsx

import type { DocsThemeConfig } from 'nextra-theme-docs'
 
const config: DocsThemeConfig = {
  // Your theme configuration
}
export default config

NextraプロジェクトでTypeScriptを活用することで、早期にエラーを検出し、コード品質を向上させ、より優れたオートコンプリートと型推論による開発者エクスペリエンスを強化できます。