clover's git

the-knife

1	---
2	title: Nuxt
3	description: Package Nuxt SSR and public assets for Neon Functions, with native Nuxt development.
4	sidebar:
5	order: 4
6	---
7
8	`Neon.Website.Nuxt` builds Nuxt with Nitro's Node target, then replaces the listening
9	wrapper with a Node 24 Fetch entry for Neon Functions. SSR and public assets ship
10	in the Function ZIP, not a container or S3 website.
11
12	## Prepare the app
13
14	Use an existing Nuxt app or the
15	[runnable Nuxt example](https://github.com/alchemy-run/alchemy/tree/main/examples/neon-website-nuxt).
16	Configure [deployment credentials](/neon/setup), then install in the app directory:
17
18	Install [Alchemy and its matching Effect dependencies](/getting-started) first;
19	use Node 24 for this build toolchain.
20
21	```sh
22	pnpm add -D @alchemy.run/frontend-frameworks @vercel/nft
23	```
24
25	Keep modules and application settings in `nuxt.config.*`. Do not override
26	`nitro.preset`: the target owns it. The `nuxt` resource prop accepts serializable
27	config overrides; keep functions and plugin instances in the config file.
28
29	## Define the stack
30
31	```typescript
32	// alchemy.run.ts
33	import * as Alchemy from "alchemy";
34	import * as Neon from "alchemy/Neon";
35	import * as Effect from "effect/Effect";
36
37	export default Alchemy.Stack(
38	"NeonNuxt",
39	{ providers: Neon.providers(), state: Alchemy.localState() },
40	Effect.gen(function* () {
41	const site = yield* Neon.Website.Nuxt("Web", {
42	rootDir: ".",
43	});
44	return { url: site.url };
45	}),
46	);
47	```
48
49	Nitro handles server routes; built public files are served from the same Function.
50	Use Nuxt's `runtimeConfig` for application configuration and its normal
51	`NUXT_*` environment mapping. Values in `runtimeConfig.public` are browser-visible.
52	The Website's `env` is also available during build and native development.
53
54	## Develop and attempt deployment
55
56	```sh
57	pnpm exec alchemy dev
58	pnpm exec alchemy deploy
59	pnpm exec alchemy destroy
60	```
61
62	Run separately, destroying when finished. Dev uses Nuxt's native server and HMR,
63	returns a local URL, and creates no implicit Project or Function. Append
64	`.pipe(Alchemy.remote())` to the Website Effect to opt into live deployment during dev.
65
66	Live deployment creates an Ohio Project when scope is omitted. Set either
67	`project` or `branch` for an existing backend; choose Ohio when adding storage.
68	Read [scope and credentials](/neon/frontend/vite#scope-and-credentials) before
69	passing backend tokens to application code.
70
71	:::caution[Production verification remains open]
72	The verification run encountered a Nuxt prerender failure in its temporary
73	dependency setup. Native dev success does not establish production packaging or
74	live acceptance. Verify your production artifact and actual Function responses;
75	Neon probes have served old code/env after successful deployment metadata updates.
76	:::
77
78	No CDN, durable Nitro cache, or image-optimization service is provisioned. Domain
79	registration does not validate TLS. See the
80	[shared deployment limits](/neon/frontend/vite#environment-and-deployment-limits).
81
82	## Reference
83
84	- [Nuxt API](/providers/neon/website/nuxt)
85	- [Runnable Nuxt example](https://github.com/alchemy-run/alchemy/tree/main/examples/neon-website-nuxt)