defineConfig

The defineConfig helper is from @solidjs/start/config and is used within app.config.ts.

It takes a configuration object with settings for SolidStart, Vite, and Nitro.

Configuring Vite

SolidStart supports most Vite options, including plugins via the vite option:

import { defineConfig } from "@solidjs/start/config";

export default defineConfig({
  vite: {
    // vite options
    plugins: [],
  },
});

The vite option can also be a function that can be customized for each Vinxi router.

In SolidStart, 3 routers are used:

• server - server-side routing
• client - for the client-side routing
• server-function - server functions.

import { defineConfig } from "@solidjs/start/config";

export default defineConfig({
  vite({ router }) {
    if (router === "server") {
    } else if (router === "client") {
    } else if (router === "server-function") {
    }
    return { plugins: [] };
  },
});

Configuring Nitro

SolidStart uses Nitro to run on a number of platforms. The server option exposes some Nitro options including the build and deployment presets. An overview of all available presets is available in the Deploy section of the Nitro documentation.

Some common ones include:

Servers

• Node.js Server (node) (Default)
• Deno Server (deno_server)
• Bun Server (bun)

Providers

• Netlify Functions and Edge (netlify, netlify-edge)
• Vercel Functions and Edge (vercel, vercel-edge)
• AWS Lambda and Lambda@Edge (aws_lambda)
• Cloudflare Workers and Pages (cloudflare, cloudflare_pages, cloudflare_module)
• Deno Deploy (deno_deploy)

Static site generation

• Route pre-rendering

By passing no arguments, the default will be the Node preset. Other presets may be automatically detected by the provider, however, if not, they must be added to the configuration within the server-preset option.

For example, using Netlify Edge would look like the following:

import { defineConfig } from "@solidjs/start/config";

export default defineConfig({
  server: {
    preset: "netlify_edge",
  },
});

Special note

SolidStart uses async local storage. Netlify, Vercel, and Deno support this out of the box but if you're using Cloudflare you will need to specify the following:

import { defineConfig } from "@solidjs/start/config";

export default defineConfig({
  server: {
    preset: "cloudflare_module",
    rollupConfig: {
      external: ["__STATIC_CONTENT_MANIFEST", "node:async_hooks"],
    },
  },
});

Within wrangler.toml you will need to enable node compatibility:

compatibility_flags = [ "nodejs_compat" ]

Parameters

ssr

Type: boolean

Default: true

Toggle between client and server rendering.

solid

Type: object

Configuration object for vite-plugin-solid.

extensions

Type: string[]

Default: ["js", "jsx", "ts", "tsx"]

Array of file extensions to be treated as routes.

server

Type: object

Nitro server config options.

appRoot

Type: string

Default: "./src"

The path to the root of the application.

routeDir

Type: string

Default: "./routes"

The path to where the routes are located.

middleware

Type: string

The path to an optional middleware file.

devOverlay

Type: boolean

Default: true

Toggle the dev overlay.

experimental.islands

Type: boolean

Default: false

Enable "islands" mode.

vite

Type: ViteConfig | ({ router }) => ViteConfig

Vite config object. Can be configured for each router which has the string value "server", "client" or "server-function"`.