Search
Docs Menu
API
Get Started
Blog
Edit

vike-solid

Version history: CHANGELOG.md
Examples: vike.dev/new and examples/
Source code: GitHub > vikejs/vike-solid

The Vike extension vike-solid is a full-fledged Solid integration, with a high-level DX like a conventional framework such as Solid Start.

The documentation for using vike-solid can be found throughout this website (vike.dev).

The guides, such as Guides > Data Fetching, assume you're using Vike with vike-react, vike-vue, or vike-solid. If you aren't then see the sections Without vike-{react,vue,solid} such as API > useData() > Without vike-{react,vue,solid}.

You can integrate Solid yourself instead of using vike-solid, see Solid > Custom integration.

Scaffold new vike-solid app

Use vike.dev/new for creating a new vike-solid app.

Add vike-solid to existing Vike app

To add vike-solid to an existing Vike app: install the vike-solid npm package (e.g. $ npm install vike-solid) then extend your existing +config.js file (or create one) with vike-solid:

// /pages/+config.js
 
import vikeSolid from 'vike-solid/config'
 
export default {
  // ...
  extends: [vikeSolid] 
}
// /pages/+config.ts
 
import type { Config } from 'vike/types'
import vikeSolid from 'vike-solid/config'
 
export default {
  // ...
  extends: [vikeSolid]
} satisfies Config

You can then use new settings introduced by vike-solid:

// /pages/+config.js
 
import vikeSolid from 'vike-solid/config'
 
export default {
  // ...
 
  // Setting to toggle SSR
  ssr: false, 
 
  extends: [vikeSolid]
}
// /pages/+config.ts
 
import type { Config } from 'vike/types'
import vikeSolid from 'vike-solid/config'
 
export default {
  // ...
 
  // Setting to toggle SSR
  ssr: false,
 
  extends: [vikeSolid]
} satisfies Config

See also:

Under the hood

The vike-solid extension is only around 1k lines of code. It's simple, readable, and highly polished.

Reading the source code of vike-solid is very much an option for understanding, debugging, and/or contributing.

Contributions are welcome!

What vike-solid does is essentially this:

It implements the following:

For a better overview, see the following lists instead. (They also include all settings and hooks created by vike-solid.)

See also