Skip to content

Migrate webtools from Vite to client-side Next.js static export (GitHub Pages compatible) - #2

Draft
jgwoolley with Copilot wants to merge 2 commits into
mainfrom
copilot/convert-to-nextjs
Draft

Migrate webtools from Vite to client-side Next.js static export (GitHub Pages compatible)#2
jgwoolley with Copilot wants to merge 2 commits into
mainfrom
copilot/convert-to-nextjs

Conversation

Copilot AI commented Aug 10, 2026

Copy link
Copy Markdown

This PR converts apps/webtools from a Vite SPA to a fully client-side Next.js app, while preserving browser-only execution and static hosting on GitHub Pages. Routing remains hash-based in-browser, and generated metadata assets are still produced for runtime features.

  • Framework/runtime migration (Vite → Next.js, client-only)

    • Replaced Vite entry/build scripts with Next.js (next dev, next build) in apps/webtools/package.json.
    • Added App Router shell (app/layout.tsx, app/page.tsx) and mounted the existing TanStack router through a client-only component (src/Nf2tApp.tsx), keeping navigation and route handling entirely in-browser.
    • Added Next TypeScript integration (next-env.d.ts, tsconfig plugin/include updates).
  • Static export + GitHub Pages pathing

    • Added next.config.mjs with:
      • output: 'export'
      • trailingSlash: true
      • repo-aware basePath / assetPrefix under GitHub Actions
    • Updated Pages workflow artifact path from apps/webtools/dist to apps/webtools/out.
  • Build-time generated browser assets

    • Replaced Vite plugin-based generated files with an explicit prebuild script: scripts/generateStaticFiles.mjs.
    • Script writes public/buildinfo.json and public/nars.json before next build, preserving existing runtime fetch behavior.
    • Added resilient fallback for NAR metadata generation when remote download is unavailable.
  • Documentation/UI alignment

    • Updated build-process route copy (buildInfo.lazy.tsx) to describe Next.js workflow and entrypoints instead of Vite-specific internals.
// apps/webtools/next.config.mjs
const nextConfig = {
  output: 'export',
  trailingSlash: true,
  basePath,
  assetPrefix: basePath || undefined,
  images: { unoptimized: true },
};

Copilot AI linked an issue Aug 10, 2026 that may be closed by this pull request
Co-authored-by: jgwoolley <26191568+jgwoolley@users.noreply.github.com>
Copilot AI changed the title [WIP] Convert the project to a fully client side NextJS app Migrate webtools from Vite to client-side Next.js static export (GitHub Pages compatible) Aug 10, 2026
Copilot AI requested a review from jgwoolley August 10, 2026 05:24
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Convert to NextJS

2 participants