From 2c794035c8ceada768806a3aa67ab7fb2990e291 Mon Sep 17 00:00:00 2001 From: Birk Skyum Date: Thu, 6 Aug 2026 19:44:50 +0200 Subject: [PATCH] chore: add deployment plugins guide page --- src/routes/solid-start/v2/(0)index.mdx | 2 +- .../solid-start/v2/(1)getting-started.mdx | 10 +-- .../v2/(2)guides/(5)deployment-plugins.mdx | 87 +++++++++++++++++++ .../reference/entrypoints/(0)vite-config.mdx | 2 + 4 files changed, 94 insertions(+), 7 deletions(-) create mode 100644 src/routes/solid-start/v2/(2)guides/(5)deployment-plugins.mdx diff --git a/src/routes/solid-start/v2/(0)index.mdx b/src/routes/solid-start/v2/(0)index.mdx index 202b307dc3..9daf8e09ed 100644 --- a/src/routes/solid-start/v2/(0)index.mdx +++ b/src/routes/solid-start/v2/(0)index.mdx @@ -18,7 +18,7 @@ description: >- SolidStart v2 builds a full-stack app on top of [Solid v1](/) and [Vite v8+](https://vite.dev). If you're currently using SolidStart v1, it's mainly a tooling and stability upgrade. -What's new in SolidStart v2 is that it uses Vite's Environment API for client and server builds and therefore works with deployment plugins such as [Nitro v3](https://nitro.build) and the [Cloudflare Vite plugin](https://www.npmjs.com/package/@cloudflare/vite-plugin). +What's new in SolidStart v2 is that it uses Vite's Environment API for client and server builds and therefore works with deployment plugins such as [Nitro v3](https://nitro.build), the [Cloudflare Vite plugin](https://developers.cloudflare.com/workers/vite-plugin/), and the [Netlify Vite plugin](https://docs.netlify.com/build/frameworks/framework-setup-guides/solidstart/). SolidStart is router agnostic, and can be used with either the official [Solid Router v1](/solid-router) or [TanStack Solid Router v1](https://tanstack.com/router/latest). diff --git a/src/routes/solid-start/v2/(1)getting-started.mdx b/src/routes/solid-start/v2/(1)getting-started.mdx index 048a84911b..456f74d01c 100644 --- a/src/routes/solid-start/v2/(1)getting-started.mdx +++ b/src/routes/solid-start/v2/(1)getting-started.mdx @@ -42,15 +42,14 @@ dev ## Configuration -Configuration lives in `vite.config.ts`. SolidStart configures the application and Nitro v3 supplies the server and deployment integration. +Configuration lives in `vite.config.ts`. Start with the `solidStart()` plugin, which configures the application: ```tsx title="vite.config.ts" import { defineConfig } from "vite"; -import { nitro } from "nitro/vite"; import { solidStart } from "@solidjs/start/config"; export default defineConfig({ - plugins: [solidStart(), nitro()], + plugins: [solidStart()], }); ``` @@ -58,15 +57,14 @@ If your app already has middleware, `solidStart()` also accepts a `middleware` o ```tsx title="vite.config.ts" import { defineConfig } from "vite"; -import { nitro } from "nitro/vite"; import { solidStart } from "@solidjs/start/config"; export default defineConfig({ - plugins: [solidStart({ middleware: "./src/middleware/index.ts" }), nitro()], + plugins: [solidStart({ middleware: "./src/middleware/index.ts" })], }); ``` -Use the top-level `nitro` property for Nitro options such as deployment presets, prerendering, tasks, and WebSockets. +To configure a production server runtime and hosting target, continue with [Deployment plugins](/solid-start/v2/guides/deployment-plugins). ## Path alias diff --git a/src/routes/solid-start/v2/(2)guides/(5)deployment-plugins.mdx b/src/routes/solid-start/v2/(2)guides/(5)deployment-plugins.mdx new file mode 100644 index 0000000000..7cfe6a827e --- /dev/null +++ b/src/routes/solid-start/v2/(2)guides/(5)deployment-plugins.mdx @@ -0,0 +1,87 @@ +--- +title: Deployment plugins +use_cases: >- + deployment, hosting, server runtime, adapters, nitro, netlify, cloudflare, + edge functions, workers +tags: + - deployment + - hosting + - vite + - nitro + - netlify + - cloudflare + - server +version: "2.0" +description: >- + Choose and configure a deployment Vite plugin for a SolidStart v2 app. +--- + +SolidStart v2 uses Vite's Environment API for its client and server builds. The `solidStart()` plugin configures the application, while a deployment Vite plugin integrates the server build with a production runtime and hosting target. + +Choose one deployment plugin. Nitro provides portable deployment presets, while the Netlify and Cloudflare plugins integrate directly with their respective platforms. + +## Nitro + +[Nitro v3](https://nitro.build/) supports multiple deployment targets through presets. + +```package-install +nitro +``` + +Add `nitro()` after `solidStart()`: + +```tsx title="vite.config.ts" +import { nitro } from "nitro/vite"; +import { defineConfig } from "vite"; +import { solidStart } from "@solidjs/start/config"; + +export default defineConfig({ + plugins: [solidStart(), nitro()], +}); +``` + +Use the top-level `nitro` property for deployment presets, prerendering, tasks, WebSockets, and other Nitro options. See the [Nitro configuration reference](https://nitro.build/config). + +## Netlify + +The [Netlify Vite plugin](https://docs.netlify.com/build/frameworks/framework-setup-guides/solidstart/) prepares the server build for Netlify Functions and emulates Netlify platform features during development. + +```package-install-dev +@netlify/vite-plugin +``` + +Add the plugin after `solidStart()` and enable its build support: + +```tsx title="vite.config.ts" +import netlify from "@netlify/vite-plugin"; +import { defineConfig } from "vite"; +import { solidStart } from "@solidjs/start/config"; + +export default defineConfig({ + plugins: [solidStart(), netlify({ build: { enabled: true } })], +}); +``` + +No SolidStart-specific adapter is required. Netlify detects SolidStart and can supply the build command and publish directory automatically. Its [SolidStart v2 announcement](https://www.netlify.com/changelog/2026-08-06-solidstart-2-on-netlify/) explains how the integration uses Vite's Environment API. + +## Cloudflare + +The [Cloudflare Vite plugin](https://developers.cloudflare.com/workers/vite-plugin/) runs the server build in the Workers runtime during development and prepares it for deployment to Cloudflare. + +```package-install-dev +@cloudflare/vite-plugin wrangler +``` + +Map the Worker to SolidStart's `ssr` environment: + +```tsx title="vite.config.ts" +import { cloudflare } from "@cloudflare/vite-plugin"; +import { defineConfig } from "vite"; +import { solidStart } from "@solidjs/start/config"; + +export default defineConfig({ + plugins: [cloudflare({ viteEnvironment: { name: "ssr" } }), solidStart()], +}); +``` + +The `viteEnvironment` option merges the Workers runtime configuration with SolidStart's server environment. Follow the Cloudflare guide to add a Wrangler configuration and any platform bindings. diff --git a/src/routes/solid-start/v2/reference/entrypoints/(0)vite-config.mdx b/src/routes/solid-start/v2/reference/entrypoints/(0)vite-config.mdx index d959d8df2a..e36afe8d86 100644 --- a/src/routes/solid-start/v2/reference/entrypoints/(0)vite-config.mdx +++ b/src/routes/solid-start/v2/reference/entrypoints/(0)vite-config.mdx @@ -54,4 +54,6 @@ export default defineConfig({ SolidStart v2 requires Vite 8 or 9. The default scripts are `vite dev` and `vite build`; `vite preview` locally serves a completed production build. +These examples use Nitro, but SolidStart also works with other deployment Vite plugins. See [Deployment plugins](/solid-start/v2/guides/deployment-plugins) for Netlify and Cloudflare configuration. + For the available server options and deployment presets, see the [Nitro configuration reference](https://nitro.build/config).