DocusaurusをTypeScriptに対応

docusaurus.config.js → docusaurus.config.ts

@@ -1,10 +1,11 @@
+import * as Preset from "@docusaurus/preset-classic";
+import { Config } from "@docusaurus/types";
 import { themes as prismThemes } from "prism-react-renderer";
 import { execSync } from "node:child_process";
 import math from "remark-math";
 import katex from "rehype-katex";
 
-/** @type {import("@docusaurus/types").Config} */
-const config = {
+const config: Config = {
   title: "ut.code(); Learn",
   tagline: "ut.code(); 公式学習教材",
   url: "https://learn.utcode.net/",
@@ -27,7 +28,6 @@ const config = {
   presets: [
     [
       "@docusaurus/preset-classic",
-      /** @type {import('@docusaurus/preset-classic').Options} */
       {
         docs: {
           showLastUpdateTime: true,
@@ -45,10 +45,9 @@ const config = {
         gtag: process.env.GOOGLE_ANALYTICS_TRACKING_ID && {
           trackingID: process.env.GOOGLE_ANALYTICS_TRACKING_ID,
         },
-      },
+      } satisfies Preset.Options,
     ],
   ],
-  /** @type {import("@docusaurus/preset-classic").ThemeConfig} */
   themeConfig: {
     docs: {
       sidebar: {
@@ -97,7 +96,7 @@ const config = {
       ],
       copyright: `Copyright © ${new Date().getFullYear()} ut.code();. Built with Docusaurus.`,
     },
-  },
+  } satisfies Preset.ThemeConfig,
 };
 
 export default config;

package.json

@@ -13,20 +13,20 @@
     "format:check": "prettier --check ."
   },
   "dependencies": {
-    "@docusaurus/core": "^3.7.0",
-    "@docusaurus/preset-classic": "^3.7.0",
-    "@docusaurus/theme-mermaid": "^3.7.0",
+    "@docusaurus/core": "^3.8.1",
+    "@docusaurus/preset-classic": "^3.8.1",
+    "@docusaurus/theme-mermaid": "^3.8.1",
     "@mdx-js/react": "^3.1.0",
     "@tippyjs/react": "^4.2.6",
     "clsx": "^2.1.1",
     "hast-util-is-element": "^3.0.0",
     "outdent": "^0.8.0",
     "prism-react-renderer": "^2.4.1",
-    "react": "^19.1.0",
+    "react": "^19.1.1",
     "react-children-utilities": "^2.10.0",
-    "react-dom": "^19.1.0",
+    "react-dom": "^19.1.1",
     "react-icons": "^5.5.0",
-    "react-slick": "^0.30.3",
+    "react-slick": "^0.31.0",
     "rehype-katex": "^7.0.1",
     "remark-math": "^6.0.0",
     "slick-carousel": "^1.8.1"
@@ -47,7 +47,11 @@
     "node": ">=18.0"
   },
   "devDependencies": {
+    "@docusaurus/module-type-aliases": "^3.8.1",
+    "@docusaurus/tsconfig": "^3.8.1",
+    "@docusaurus/types": "^3.8.1",
     "@types/react-slick": "^0.23.13",
-    "prettier": "^3.5.3"
+    "prettier": "^3.6.2",
+    "typescript": "^5.9.2"
   }
 }

sidebars.ts

@@ -0,0 +1,7 @@
+import { SidebarsConfig } from "@docusaurus/plugin-content-docs";
+
+const sidebars: SidebarsConfig = {
+  sidebar: [{ type: "autogenerated", dirName: "." }],
+};
+
+export default sidebars;

src/pages/index.js → src/pages/index.tsx

@@ -6,8 +6,7 @@ import useBaseUrl from "@docusaurus/useBaseUrl";
 import styles from "./styles.module.css";
 
 function Home() {
-  const context = useDocusaurusContext();
-  const { siteConfig = {} } = context;
+  const { siteConfig } = useDocusaurusContext();
   return (
     <Layout
       title={`ut.code(); Learn`}

tsconfig.json

@@ -0,0 +1,6 @@
+{
+  "extends": "@docusaurus/tsconfig",
+  "compilerOptions": {
+    "baseUrl": "."
+  }
+}