vercel · kodiakhq · Mar 27, 2023 · Mar 27, 2023 · Mar 27, 2023 · Mar 27, 2023
@@ -34,3 +34,5 @@ yarn-error.log*
 # typescript
 *.tsbuildinfo
 next-env.d.ts
+
+.vscode
@@ -1,6 +1,6 @@
 # Deploying to GitHub Pages
 
-This example supports deloying a static Next.js application (using `next export`) to GitHub Pages.
+This example supports deloying a statically exported Next.js application to GitHub Pages.
 
 The `out` directory should not be ignored by version control.
 

@@ -2,11 +2,11 @@ import Link from 'next/link'
 
 export default function About() {
   return (
-    <div>
-      <div>About</div>
+    <>
+      <h1>About</h1>
       <div>
         Back to <Link href="/">Home</Link>
       </div>
-    </div>
+    </>
   )
 }
@@ -0,0 +1,11 @@
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <html lang="en">
+      <body>{children}</body>
+    </html>
+  )
+}
@@ -4,7 +4,11 @@
  * @type {import('next').NextConfig}
  **/
 const nextConfig = {
+  output: 'export',
   basePath: '/gh-pages-test',
+  experimental: {
+    appDir: true,
+  },
 }
 
 module.exports = nextConfig
@@ -1,19 +1,17 @@
 {
   "private": true,
   "scripts": {
-    "dev": "next",
-    "build": "next build && next export",
+    "dev": "next dev",
+    "build": "next build",
     "deploy": "next build && touch out/.nojekyll && git add out/ && git commit -m \"Deploy\" && git subtree push --prefix out origin gh-pages"
   },
   "dependencies": {
-    "next": "latest",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0"
-  },
-  "devDependencies": {
     "@types/node": "^18.11.5",
-    "@types/react": "^18.0.23",
     "@types/react-dom": "^18.0.7",
+    "@types/react": "^18.0.23",
+    "next": "latest",
+    "react-dom": "^18.2.0",
+    "react": "^18.2.0",
     "typescript": "^4.8.4"
   }
 }
@@ -13,8 +13,19 @@
     "resolveJsonModule": true,
     "isolatedModules": true,
     "jsx": "preserve",
-    "incremental": true
+    "incremental": true,
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ]
   },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", "next.config.js"],
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    "next.config.js",
+    ".next/types/**/*.ts"
+  ],
   "exclude": ["node_modules"]
 }
@@ -1,8 +1,10 @@
-# Static export example
+# Next.js Static Export
 
-This example show how to export to static HTML files your Next.js application fetching data from an API to generate a dynamic list of pages.
+Next.js enables starting as a static site or Single-Page Application (SPA), then later optionally upgrading to use features that require a server.
 
-When trying to run `npm start` it will build and export your pages into the `out` folder and serve them on `localhost:3000`.
+When running `next build`, Next.js generates an HTML file per route. By breaking a strict SPA into individual HTML files, Next.js can avoid loading unnecessary JavaScript code on the client-side, reducing the bundle size and enabling faster page loads.
+
+Learn more: https://beta.nextjs.org/docs/configuring/static-export
 
 ## Deploy your own
 

@@ -0,0 +1,12 @@
+import Link from 'next/link'
+
+export default function About() {
+  return (
+    <>
+      <h1>About</h1>
+      <div>
+        Back to <Link href="/">Home</Link>
+      </div>
+    </>
+  )
+}
@@ -0,0 +1,11 @@
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  return (
+    <html lang="en">
+      <body>{children}</body>
+    </html>
+  )
+}
@@ -0,0 +1,9 @@
+import Link from 'next/link'
+
+export default function Home() {
+  return (
+    <div>
+      Hello World. <Link href="/about">About</Link>
+    </div>
+  )
+}
@@ -0,0 +1,13 @@
+// @ts-check
+
+/**
+ * @type {import('next').NextConfig}
+ **/
+const nextConfig = {
+  output: 'export',
+  experimental: {
+    appDir: true,
+  },
+}
+
+module.exports = nextConfig
@@ -3,24 +3,16 @@
   "scripts": {
     "dev": "next",
     "build": "next build",
-    "preexport": "npm run build",
-    "export": "next export",
-    "prestart": "npm run export",
-    "start": "serve out",
-    "lint": "next lint"
+    "start": "serve out"
   },
   "dependencies": {
+    "@types/node": "^18.11.5",
+    "@types/react-dom": "^18.0.7",
+    "@types/react": "^18.0.23",
     "next": "latest",
-    "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "serve": "^14.0.1"
-  },
-  "devDependencies": {
-    "@types/node": "^18.0.0",
-    "@types/react": "^18.0.14",
-    "@types/react-dom": "^18.0.5",
-    "eslint": "8.19.0",
-    "eslint-config-next": "12.2.0",
-    "typescript": "^4.7.4"
+    "react": "^18.2.0",
+    "serve": "^14.0.1",
+    "typescript": "^4.8.4"
   }
 }
@@ -7,14 +7,25 @@
     "strict": true,
     "forceConsistentCasingInFileNames": true,
     "noEmit": true,
-    "incremental": true,
     "esModuleInterop": true,
     "module": "esnext",
+    "moduleResolution": "node",
     "resolveJsonModule": true,
     "isolatedModules": true,
     "jsx": "preserve",
-    "moduleResolution": "node"
+    "incremental": true,
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ]
   },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    "next.config.js",
+    ".next/types/**/*.ts"
+  ],
   "exclude": ["node_modules"]
 }