create-vite-extra

5.0.2 verified Mon Apr 27 auth: no javascript

A scaffolding tool for Vite projects with extra templates beyond the official Vite starter. Version 5.0.2, released slowly with each Vite major version. It provides templates for SSR (server-side rendering) with Vanilla, Vue, React, Preact, and streaming variants, all with optional TypeScript. Unlike the official create-vite, this focuses on advanced setups like SSR and React compiler experiments. Requires Node.js 20.19+ or 22.12+.

Common errors

error Error: Unknown command: vite-extra ↓

cause Using 'npx create-vite-extra' which isn't a standard command structure.

fix

Use 'npm create vite-extra@latest' or 'pnpm create vite-extra'.

error Error: The engine "node" is incompatible with this module. Expected version ">=20.19.0 || >=22.12.0" ↓

cause Node.js version is too old for create-vite-extra v5.

fix

Upgrade Node.js to 20.19+ or 22.12+.

error npm ERR! Unknown option: --template ↓

cause The --template flag was passed to npm instead of the create script because '--' was missing.

fix

Use 'npm create vite-extra@latest -- --template ssr-vue' with the double dash.

Warnings

breaking create-vite-extra v4 requires Node.js 18+, but v5 requires 20.19+ or 22.12+. ↓

fix Upgrade Node.js to version 20.19+ or 22.12+.

gotcha Some templates (e.g., ssr-react-compiler) are experimental and may break with newer Vite versions. ↓

fix Check the README or template status before using experimental templates.

gotcha When using npm, the --template flag must be preceded by -- to avoid passing it to npm itself. ↓

fix Use npm create vite-extra@latest -- --template <name>.

deprecated The template 'ssr-react-compiler-streaming-ts' appears twice in the README table, one might be a duplicate or misnamed. ↓

fix Use 'ssr-react-compiler-streaming-ts' if you need it; be aware of potential duplication.

Install

npm install create-vite-extra

yarn add create-vite-extra

pnpm add create-vite-extra

Imports

create-vite-extra
wrong
```
npx create-vite-extra
```
correct
```
npm create vite-extra@latest
```
Always use create command, not npx, for the latest version. Equivalent to npx create-vite-extra but ensures caching.
project scaffolding
wrong
```
npm create vite-extra my-app --template ssr-vue
```
correct
```
npm create vite-extra@latest my-app -- --template ssr-vue
```
The extra '--' is needed before --template in npm; omitting it passes --template to npm itself, not the script.

pnpm scaffolding

wrong

pnpm create vite-extra my-app -- --template ssr-vue

correct

pnpm create vite-extra my-app --template ssr-vue

pnpm does not need the extra '--'; it passes args directly to the package.

Quickstart

Scaffold a new Vite SSR Vue project with TypeScript using create-vite-extra.

npm create vite-extra@latest my-app -- --template ssr-vue
cd my-app
npm install
npm run dev