vite-plugin-build-routes

A Vite plugin to simplify the build of API routes: copy all files from a target directory to a build output directory.

⚙️ Install

1yarn add -D vite-plugin-build-routes

📖 Usage

Example:

• /server/api as target directory that contains /server/api/user/index.ts file
• /dist as build output directory
• register vite-plugin-build-routes plugin and server plugin (see below)
• build with Vite (e.g. yarn vite build)
• the result is /dist/server/api/user/index.mjs

Register the Vite Plugin (example with Vike)

1// vite.config.ts
2import vike from 'vike/plugin'
3import { vikeNode } from 'vike-node/plugin'
4import type { UserConfig } from 'vite'
5import viteBuildRoutes from 'vite-plugin-build-routes'
6
7export default {
8  plugins: [
9    vike(),
10    vikeNode('server/index.ts'),
11    viteBuildRoutes('server/api')
12    // OR use a pattern instead of default '**/*.ts'
13    // viteBuildRoutes({
14    //   entry: 'server/api',
15    //   pattern: '**/*.js'
16    // })
17  ]
18} satisfies UserConfig

Use the Server Plugin (example with Hono)

Use the universal-autorouter package to automatically scan and load all routes to the server.

1// /server/index.ts
2import path from 'node:path'
3import { serve } from '@hono/node-server'
4import { Hono } from 'hono'
5import vike from 'vike-node/hono'
6import autoloadRoutes from 'universal-autorouter'
7
8const app = new Hono()
9
10await autoloadRoutes(app, {
11  pattern: process.env.NODE_ENV === 'production' ? '**/*.mjs' : '**/*.ts',
12  prefix: '/api',
13  routesDir: path.resolve(import.meta.dirname, 'api'),
14  viteDevServer: globalThis.__vikeNode?.viteDevServer  // needed for Vite's HMR
15})
16
17app.use(vike())
18
19const port = +(process.env.PORT || 3000)
20
21serve({
22  fetch: app.fetch,
23  port
24}, () => console.log(`Server running at http://localhost:${port}`))