diff --git a/examples/using-preact/next.config.js b/examples/using-preact/next.config.js
index cffe26659035..f0e665c2218a 100644
--- a/examples/using-preact/next.config.js
+++ b/examples/using-preact/next.config.js
@@ -1,5 +1,8 @@
 const withPreact = require('next-plugin-preact')
 
-module.exports = withPreact({
+/** @type {import('next').NextConfig} */
+const nextConfig = {
   /* regular next.js config options here */
-})
+}
+
+module.exports = withPreact(nextConfig)
diff --git a/examples/using-preact/package.json b/examples/using-preact/package.json
index 0f8d828fc183..dc2b8b3f46da 100644
--- a/examples/using-preact/package.json
+++ b/examples/using-preact/package.json
@@ -5,14 +5,18 @@
     "build": "next build",
     "start": "next start"
   },
-  "devDependencies": {},
   "dependencies": {
-    "next": "^12.0.0",
-    "next-plugin-preact": "^3.0.6",
-    "preact": "^10.5.15",
-    "preact-render-to-string": "^5.1.19",
-    "react": "npm:@preact/compat@^17.0.2",
-    "react-dom": "npm:@preact/compat@^17.0.2",
-    "react-ssr-prepass": "npm:preact-ssr-prepass@^1.2.0"
+    "next": "latest",
+    "next-plugin-preact": "latest",
+    "preact": "^10.10.6",
+    "preact-render-to-string": "^5.2.3",
+    "react": "npm:@preact/compat@^17.1.1",
+    "react-dom": "npm:@preact/compat@^17.1.1",
+    "react-ssr-prepass": "npm:preact-ssr-prepass@1.2.0"
+  },
+  "devDependencies": {
+    "@types/node": "18.7.15",
+    "@types/react": "16.9.17",
+    "typescript": "4.8.2"
   }
 }
diff --git a/examples/using-preact/pages/about.js b/examples/using-preact/pages/about.js
deleted file mode 100644
index 46817af02a5c..000000000000
--- a/examples/using-preact/pages/about.js
+++ /dev/null
@@ -1,3 +0,0 @@
-export default function About() {
-  return <div>About us</div>
-}
diff --git a/examples/using-preact/pages/about.tsx b/examples/using-preact/pages/about.tsx
new file mode 100644
index 000000000000..71c7703a7bd2
--- /dev/null
+++ b/examples/using-preact/pages/about.tsx
@@ -0,0 +1,3 @@
+export default function AboutPage() {
+  return <div>About us</div>
+}
diff --git a/examples/using-preact/pages/index.js b/examples/using-preact/pages/index.tsx
similarity index 91%
rename from examples/using-preact/pages/index.js
rename to examples/using-preact/pages/index.tsx
index 62301b996922..a0051fe32b9f 100644
--- a/examples/using-preact/pages/index.js
+++ b/examples/using-preact/pages/index.tsx
@@ -1,6 +1,6 @@
 import Link from 'next/link'
 
-export default function Home() {
+export default function IndexPage() {
   return (
     <div>
       Hello World.{' '}
diff --git a/examples/using-preact/pages/ssg.js b/examples/using-preact/pages/ssg.js
deleted file mode 100644
index 58adabc4b5b7..000000000000
--- a/examples/using-preact/pages/ssg.js
+++ /dev/null
@@ -1,9 +0,0 @@
-export default function SSG({ framework }) {
-  return <div>{framework} ssg example</div>
-}
-
-export function getStaticProps() {
-  return {
-    props: { framework: 'preact' },
-  }
-}
diff --git a/examples/using-preact/pages/ssg.tsx b/examples/using-preact/pages/ssg.tsx
new file mode 100644
index 000000000000..ef13cface3bb
--- /dev/null
+++ b/examples/using-preact/pages/ssg.tsx
@@ -0,0 +1,13 @@
+import { InferGetStaticPropsType } from 'next'
+
+export function getStaticProps() {
+  return {
+    props: { framework: 'preact' },
+  }
+}
+
+export default function SSGPage({
+  framework,
+}: InferGetStaticPropsType<typeof getStaticProps>) {
+  return <div>{framework} ssg example</div>
+}
diff --git a/examples/using-preact/pages/ssr.js b/examples/using-preact/pages/ssr.js
deleted file mode 100644
index 695e329a8591..000000000000
--- a/examples/using-preact/pages/ssr.js
+++ /dev/null
@@ -1,9 +0,0 @@
-export default function SSR({ framework }) {
-  return <div>{framework} ssr example</div>
-}
-
-export function getServerSideProps() {
-  return {
-    props: { framework: 'preact' },
-  }
-}
diff --git a/examples/using-preact/pages/ssr.tsx b/examples/using-preact/pages/ssr.tsx
new file mode 100644
index 000000000000..24c86325aa72
--- /dev/null
+++ b/examples/using-preact/pages/ssr.tsx
@@ -0,0 +1,13 @@
+import { InferGetServerSidePropsType } from 'next'
+
+export function getServerSideProps() {
+  return {
+    props: { framework: 'preact' },
+  }
+}
+
+export default function SSRPage({
+  framework,
+}: InferGetServerSidePropsType<typeof getServerSideProps>) {
+  return <div>{framework} ssr example</div>
+}
diff --git a/examples/using-preact/tsconfig.json b/examples/using-preact/tsconfig.json
new file mode 100644
index 000000000000..f83cb8071c2e
--- /dev/null
+++ b/examples/using-preact/tsconfig.json
@@ -0,0 +1,22 @@
+{
+  "compilerOptions": {
+    "target": "es5",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "incremental": true,
+    "esModuleInterop": true,
+    "moduleResolution": "node",
+    "module": "esnext",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "preserve",
+    "jsxFactory": "h",
+    "jsxFragmentFactory": "Fragment"
+  },
+  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+  "exclude": ["node_modules"]
+}