development workflow

npm scripts, local Vite, lint, production builds, GitHub Pages deploy.

See PWA Configuration.

npm run dev

Development server configuration#

flowchart TD
  Vite["vite"] --> HMR["HMR"]
  Vite --> Alias["@ -> src lucide-react ESM pin"]
  Vite --> Proxy["/api/cloudflare"]
  Vite --> PWA["devOptions.enabled"]

Default base is /. Use build:gh when you need /jportal/.

VITE_ vars from .env. .env is gitignored.

npm run build

flowchart TD
  Build["vite build"] --> Bundle["hashed JS CSS"]
  Build --> Copy["public pwa-icons artifact"]
  Build --> SW["Workbox sw.js"]
  Build --> MW["manifest.webmanifest"]

Outputs: dist/index.html, dist/assets/*, dist/sw.js, dist/manifest.webmanifest, icons, wheels.

npm run lint

Plugins: @eslint/js, eslint-plugin-react, react-hooks, react-refresh, @tanstack/eslint-plugin-query.

npm run preview

Serves dist/ (often port 4173). Use it to test the worker and base path.

npm run deploy

flowchart TD
  Deploy["npm run deploy"] --> Pre["predeploy build:gh"]
  Pre --> Push["gh-pages -d dist"]
  Push --> Site["https://codeblech.github.io/jportal"]

homepage in package.json matches that URL. Router is HashRouter so Pages needs no rewrites.

flowchart LR
  Dev["npm run dev"] --> Lint["npm run lint"]
  Lint --> Build["npm run build"]
  Build --> Preview["npm run preview"]
  Preview --> Ship["npm run deploy"]

Vite 7, plugin-react, vite-plugin-pwa, vite-plugin-svgr, Tailwind 4 PostCSS, TypeScript 5.9, ESLint 9, gh-pages 6.2.