Nuxt

Map your domain

hatch add myapp.test 3000 --https

Configure the dev server

Nuxt uses Nitro as its server and Vite for the client-side dev server. Configure both in nuxt.config.ts:

// nuxt.config.ts
export default defineNuxtConfig({
  devServer: {
    host: '0.0.0.0',
  },
  vite: {
    server: {
      hmr: {
        host: 'myapp.test',
        protocol: 'wss',
      },
      allowedHosts: ['myapp.test'],
    },
  },
});

Environment variables

# .env
NUXT_PUBLIC_APP_URL=https://myapp.test

Access at runtime with useRuntimeConfig().public.appUrl after adding it to your runtimeConfig.

Server routes

Nuxt server routes (server/api/) are served on the same port as your app, so they work through Hatch with no extra configuration.

Project config

# .hatch.yaml
domains:
  - domain: myapp.test
    port: 3000
    https: true