Getting started

The easiest way to start a new SolidStart project is with create-solid. It can scaffold a new app from the SolidStart template or from one of the official examples.

Create a project

Create a new app with the Solid scaffolding tool:

npm init solid

pnpm create solid

yarn create solid

bun create solid

deno init --npm solid

Follow the interactive prompts and choose the SolidStart template or an official example that matches your use case.

After the project is created, install dependencies:

npm i

pnpm i

yarn i

bun i

deno i

Then start the development server:

npm run dev

pnpm dev

yarn dev

bun run dev

deno run dev

Configuration

Configuration lives in vite.config.ts, where the solidStart() plugin from @solidjs/start/config does the work.

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

export default defineConfig({
  plugins: [solidStart()],
});

If your app already has middleware, solidStart() also accepts a middleware option:

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

export default defineConfig({
  plugins: [solidStart({ middleware: "./src/middleware/index.ts" })],
});

Start adding routes

The filesystem router reads files from your routes directory and turns them into UI routes or API routes. For example:

• src/routes/index.tsx becomes /
• src/routes/about.tsx becomes /about
• src/routes/api/ping.ts can expose /api/ping

Read Routing next if you want the exact filename conventions.

Type support

Environment types ship in @solidjs/start/env. Add it to your TypeScript config if your template has not already done so.

{
  "compilerOptions": {
    "types": ["@solidjs/start/env"]
  }
}

If you are migrating an existing app instead of creating a new one, continue with Migrating from v1.