hnh-map/frontend-nuxt

HnH Map – Nuxt 3 frontend

Nuxt 3 + Tailwind + DaisyUI frontend for the HnH map. Served by the Go backend under /map/.

In dev mode the app is available at the path with baseURL /map/ (e.g. http://localhost:3000/map/). The Go backend must be reachable (directly or via the dev proxy in nuxt.config.ts).

Project structure

• pages/ — route pages (e.g. map view, profile, login)
• components/ — Vue components
• composables/ — shared composition functions
• layouts/ — layout components
• server/ — Nitro server (if used)
• plugins/ — Nuxt plugins
• public/gfx/ — static assets (sprites, terrain, etc.)

Requirements

• Node.js 20+ (required for build; engines in package.json). Use nvm use if you have .nvmrc, or build via Docker (see below).
• npm

Setup

npm install

Development

npm run dev

Then open the app at the path shown (e.g. http://localhost:3000/map/). Ensure the Go backend is running and proxying or serving this app if needed.

Build

npm run build

Static export (for Go http.Dir):

npm run generate

Output is in .output/public. To serve from the existing frontend directory, copy contents to ../frontend after generate, or set nitro.output.dir in nuxt.config.ts and build from the repo root.

Build with Docker (Node 20)

Build requires Node 20+. If your host has an older version (e.g. Node 18), build the frontend in Docker:

docker build -t frontend-nuxt .
docker create --name fn frontend-nuxt
docker cp fn:/frontend ./output-public
docker rm fn
# Copy output-public/* into repo frontend/ and run Go server

Cutover from Vue 2 frontend

1. Build this app (npm run generate).
2. Copy .output/public/* into the repo’s frontend directory (or point Go at the Nuxt output directory).
3. Restart the Go server. The same /map/ routes and API remain.