diff --git a/examples/progressive-web-app/next-env.d.ts b/examples/progressive-web-app/next-env.d.ts
new file mode 100644
index 0000000000000..4f11a03dc6cc3
--- /dev/null
+++ b/examples/progressive-web-app/next-env.d.ts
@@ -0,0 +1,5 @@
+///
+///
+
+// NOTE: This file should not be edited
+// see https://nextjs.org/docs/basic-features/typescript for more information.
diff --git a/examples/progressive-web-app/next.config.js b/examples/progressive-web-app/next.config.js
index 778ea93311dec..a62a930ff3634 100644
--- a/examples/progressive-web-app/next.config.js
+++ b/examples/progressive-web-app/next.config.js
@@ -1,3 +1,4 @@
+/** @type {import('next').NextConfig} */
const withPWA = require('next-pwa')
const runtimeCaching = require('next-pwa/cache')
diff --git a/examples/progressive-web-app/package.json b/examples/progressive-web-app/package.json
index c16f55ccc4985..1c8039c1130c0 100644
--- a/examples/progressive-web-app/package.json
+++ b/examples/progressive-web-app/package.json
@@ -10,5 +10,10 @@
"next-pwa": "^5.4.1",
"react": "^17.0.2",
"react-dom": "^17.0.2"
+ },
+ "devDependencies": {
+ "@types/node": "17.0.4",
+ "@types/react": "17.0.38",
+ "typescript": "4.5.4"
}
}
diff --git a/examples/progressive-web-app/pages/_app.js b/examples/progressive-web-app/pages/_app.tsx
similarity index 90%
rename from examples/progressive-web-app/pages/_app.js
rename to examples/progressive-web-app/pages/_app.tsx
index cca47aae9e44a..3601ddfa987de 100644
--- a/examples/progressive-web-app/pages/_app.js
+++ b/examples/progressive-web-app/pages/_app.tsx
@@ -1,7 +1,8 @@
import Head from 'next/head'
import '../styles/globals.css'
+import { AppProps } from 'next/app'
-export default function MyApp({ Component, pageProps }) {
+export default function MyApp({ Component, pageProps }: AppProps) {
return (
<>
diff --git a/examples/progressive-web-app/pages/api/hello.js b/examples/progressive-web-app/pages/api/hello.ts
similarity index 55%
rename from examples/progressive-web-app/pages/api/hello.js
rename to examples/progressive-web-app/pages/api/hello.ts
index 1424b47343d64..a42f4634c2b13 100644
--- a/examples/progressive-web-app/pages/api/hello.js
+++ b/examples/progressive-web-app/pages/api/hello.ts
@@ -1,6 +1,7 @@
// Next.js API route support: https://nextjs.org/docs/api-routes/introduction
+import { NextApiRequest, NextApiResponse } from 'next'
-const hello = (req, res) => {
+const hello = (req: NextApiRequest, res: NextApiResponse) => {
res.status(200).json({ name: 'John Doe' })
}
diff --git a/examples/progressive-web-app/pages/index.js b/examples/progressive-web-app/pages/index.tsx
similarity index 100%
rename from examples/progressive-web-app/pages/index.js
rename to examples/progressive-web-app/pages/index.tsx
diff --git a/examples/progressive-web-app/tsconfig.json b/examples/progressive-web-app/tsconfig.json
new file mode 100644
index 0000000000000..99710e857874f
--- /dev/null
+++ b/examples/progressive-web-app/tsconfig.json
@@ -0,0 +1,20 @@
+{
+ "compilerOptions": {
+ "target": "es5",
+ "lib": ["dom", "dom.iterable", "esnext"],
+ "allowJs": true,
+ "skipLibCheck": true,
+ "strict": true,
+ "forceConsistentCasingInFileNames": true,
+ "noEmit": true,
+ "esModuleInterop": true,
+ "module": "esnext",
+ "moduleResolution": "node",
+ "resolveJsonModule": true,
+ "isolatedModules": true,
+ "jsx": "preserve",
+ "incremental": true
+ },
+ "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+ "exclude": ["node_modules"]
+}