tsconfig.json strictest

src/about/AboutPage.tsx

@@ -2,7 +2,7 @@ import "./about.scss";
 import openingImage from "../img/IMG_20240725_175449_803.jpg";
 import rainbow from "../img/IMG-0186.jpg";
 import japanese from "../img/IMG_20230531_000224_01.jpg";
-import {PropsWithChildren} from "react";
+import type {PropsWithChildren} from "react";
 
 export default function AboutPage() {
   return <main className="about-page">

src/index/Canvas.tsx

@@ -1,8 +1,7 @@
 import {motion} from "framer-motion";
 import "./canvas.scss";
 import {Canvas as ThreeCanvas, useFrame} from "@react-three/fiber";
-import React, {useMemo, useRef, useState} from "react";
-import {Mesh, Vector3} from "three";
+import {Vector3} from "three";
 import {Moon} from "./Moon";
 import {Stars} from "./Stars";
 

src/index/Moon.tsx

@@ -1,4 +1,4 @@
-import {useMemo, useRef, useState} from "react";
+import {useRef, useState} from "react";
 import {Mesh} from "three";
 import {useFrame} from "@react-three/fiber";
 

src/nav/Links.tsx

@@ -1,9 +1,9 @@
-import React, {useState} from "react";
+import {useState} from "react";
 import {Link} from "../router/Link";
 import {motion} from "framer-motion";
 
 export function Links() {
-  const [links, setLinks] = useState(["About", "Articles"]);
+  const [links] = useState(["About", "Articles"]);
 
   return <div className="links">
     { links.map(() => /* add spacers for flexbox */ <div/> )}

src/nav/Nav.tsx

@@ -1,4 +1,4 @@
-import React, {useState} from "react";
+import {useState} from "react";
 import {FontAwesomeIcon} from "@fortawesome/react-fontawesome";
 import {faBars} from "@fortawesome/free-solid-svg-icons/faBars";
 import {Menu} from "./Menu";

src/router/RouterContext.tsx

@@ -1,4 +1,4 @@
-import {createContext, PropsWithChildren, useContext, useEffect, useState, useSyncExternalStore} from "react";
+import {createContext, PropsWithChildren, useContext, useEffect, useState, } from "react";
 import {DEFAULT, Path, Router} from "./router";
 
 const RouterContext = createContext<Router>(DEFAULT);

tsconfig.json

@@ -1,28 +1,38 @@
 {
   "compilerOptions": {
-    "target": "es5",
+    "target": "ES2022",
     "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
+      "DOM",
+      "DOM.Iterable",
+      "ES2022"
     ],
     "types": [
       "webpack/module",
       "./src/index.d.ts"
     ],
-    "allowJs": true,
     "skipLibCheck": true,
     "esModuleInterop": true,
     "allowSyntheticDefaultImports": true,
-    "strict": true,
     "forceConsistentCasingInFileNames": true,
-    "noFallthroughCasesInSwitch": true,
-    "module": "esnext",
-    "moduleResolution": "node",
+    "module": "ESNext",
+    "moduleResolution": "bundler",
     "resolveJsonModule": true,
     "isolatedModules": true,
     "noEmit": true,
-    "jsx": "react-jsx"
+    "jsx": "react-jsx",
+
+    "strict": true,
+    "allowJs": false,
+    "noFallthroughCasesInSwitch": true,
+    "allowUnreachableCode": false,
+    "exactOptionalPropertyTypes": true,
+    "noImplicitOverride": true,
+    "noImplicitReturns": true,
+    "noPropertyAccessFromIndexSignature": true,
+    "noUncheckedIndexedAccess": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "allowUnusedLabels": false,
   },
   "include": [
     "src"