1---
2name: vite-build-ssr
3description: Vite library mode, multi-page apps, JavaScript API, and SSR guidance
4---
5 
6# Build and SSR
7 
8## Library Mode
9 
10Build a library for distribution:
11 
12```ts
13// vite.config.ts
14import { resolve } from 'node:path'
15import { defineConfig } from 'vite'
16 
17export default defineConfig({
18  build: {
19    lib: {
20      entry: resolve(import.meta.dirname, 'lib/main.ts'),
21      name: 'MyLib',
22      fileName: 'my-lib',
23    },
24    rolldownOptions: {
25      external: ['vue', 'react'],
26      output: {
27        globals: {
28          vue: 'Vue',
29          react: 'React',
30        },
31      },
32    },
33  },
34})
35```
36 
37### Multiple Entries
38 
39```ts
40build: {
41  lib: {
42    entry: {
43      'my-lib': resolve(import.meta.dirname, 'lib/main.ts'),
44      secondary: resolve(import.meta.dirname, 'lib/secondary.ts'),
45    },
46    name: 'MyLib',
47  },
48}
49```
50 
51### Output Formats
52 
53- Single entry: `es` and `umd`
54- Multiple entries: `es` and `cjs`
55 
56### Package.json Setup
57 
58```json
59{
60  "name": "my-lib",
61  "type": "module",
62  "files": ["dist"],
63  "main": "./dist/my-lib.umd.cjs",
64  "module": "./dist/my-lib.js",
65  "exports": {
66    ".": {
67      "import": "./dist/my-lib.js",
68      "require": "./dist/my-lib.umd.cjs"
69    },
70    "./style.css": "./dist/my-lib.css"
71  }
72}
73```
74 
75## Multi-Page App
76 
77```ts
78export default defineConfig({
79  build: {
80    rolldownOptions: {
81      input: {
82        main: resolve(import.meta.dirname, 'index.html'),
83        nested: resolve(import.meta.dirname, 'nested/index.html'),
84      },
85    },
86  },
87})
88```
89 
90## SSR Development
91 
92**Note:** Vite's SSR support is **low-level** and designed mostly for meta-framework authors, not application developers. If you need SSR for your app, use a Vite-based meta-framework instead:
93 
94- **Nuxt** (Vue) - https://nuxt.com
95- **SvelteKit** (Svelte) - https://svelte.dev/docs/kit
96- **SolidStart** (Solid) - https://start.solidjs.com
97- **TanStack Start** (React) - https://tanstack.com/start
98 
99These frameworks build on top of Vite's SSR primitives so you don't have to wire them up yourself.
100 
101**Need a server?** Consider [Nitro](https://nitro.build) -- think of it as "Vite for servers." Nitro provides a portable, framework-agnostic server layer with file-based API routing, auto-imports, and deployment presets for dozens of platforms (Node.js, Deno, Bun, Cloudflare Workers, Vercel, Netlify, etc.). It integrates naturally with Vite and is what powers Nuxt's server engine. See the [Nitro docs](https://nitro.build) for more details.
102 
103## JavaScript API
104 
105### createServer
106 
107```ts
108import { createServer } from 'vite'
109 
110const server = await createServer({
111  configFile: false,
112  root: import.meta.dirname,
113  server: { port: 1337 },
114})
115 
116await server.listen()
117server.printUrls()
118```
119 
120### build
121 
122```ts
123import { build } from 'vite'
124 
125await build({
126  root: './project',
127  build: { outDir: 'dist' },
128})
129```
130 
131### preview
132 
133```ts
134import { preview } from 'vite'
135 
136const previewServer = await preview({
137  preview: { port: 8080, open: true },
138})
139previewServer.printUrls()
140```
141 
142### resolveConfig
143 
144```ts
145import { resolveConfig } from 'vite'
146 
147const config = await resolveConfig({}, 'build')
148```
149 
150### loadEnv
151 
152```ts
153import { loadEnv } from 'vite'
154 
155const env = loadEnv('development', process.cwd(), '')
156// Loads all env vars (empty prefix = no filtering)
157```
158 
159<!--
160Source references:
161- https://vite.dev/guide/build
162- https://vite.dev/guide/api-javascript
163- https://nitro.build
164-->
165