vite-react

library5.0.0jsnpmunverified

A React-specific configuration preset for Vite that bundles multiple plugins and settings into a single dependency. Latest version 5.0.0 requires Vite ^7 and Node ^20.19.0 || >=22.12.0. Active development with major releases aligning with Vite's major versions. Key differentiators: automatically includes @vitejs/plugin-react-swc (or babel), sass/less preprocessors, path alias resolution from tsconfig, auto-generated HTTPS certificates, CSS modules with development-friendly names, legacy browser support via @vitejs/plugin-legacy, and QR code for mobile preview. Only supports ESM since v4.0.0.

web-framework devops

npm install vite-react

github ↗package ↗

INSTALL

IMPORT

SIG · VITE-REACT

vite-react

web-frameworkjavascriptv5.0.0

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

defineConfig

✓ import { defineConfig } from 'vite-react'

✗ import { defineConfig } from 'vite'

Replace vite's defineConfig with vite-react's enhanced version which accepts additional configs like react, legacy, html.

default

✓ import viteReact from 'vite-react'

✗ const viteReact = require('vite-react')

Package is ESM-only since v4.0.0. Use import syntax.

defineConfig (CommonJS)

✓ // Cannot use require. Must use ESM import.

✗ const { defineConfig } = require('vite-react')

vite-react v4+ dropped CJS support. Use ESM imports only.

type definitions

✓ No manual types import needed; types are auto-included.

✗ /// <reference types="vite/client" /> or 'types' in tsconfig

vite-react automatically provides vite/client types. Remove any manual reference.

Minimal vite.config.mts showing enhanced defineConfig with react, legacy, and server options.

// vite.config.mts import { defineConfig } from 'vite-react'; export default defineConfig({ react: { swc: true, // default, use SWC for fast refresh }, legacy: true, // enable @vitejs/plugin-legacy html: { minify: true }, server: { https: true, // auto-generate self-signed cert qrcode: true, // show QR code in terminal watchExtend: ['config/*.json'], // additional files to watch }, resolve: { aliasFromTsconfig: true, // read paths from tsconfig.json }, build: { chunkSizeWarningLimit: 800, }, });

Debug

Known issues

breakingv5.0.0 requires Vite ^7. Using with older Vite will fail.

fix

Update vite to ^7 and vite-react to ^5.0.0.

affects: <5.0.0

breakingv4.0.0 dropped CommonJS support. Only ESM is supported.

fix

Use ESM imports (import/export). Add 'type': 'module' in package.json or rename config to .mts/.mjs.

affects: >=4.0.0

breakingv4.0.0 requires Vite ^6.

fix

Update vite to ^6 for v4.x.

affects: >=4.0.0 <5.0.0

deprecatedv3.0.0 required Vite ^5. Older Vite versions not supported.

fix

Use vite ^5 for v3.x.

affects: >=3.0.0 <4.0.0

gotchareact options passed to defineConfig may conflict if @vitejs/plugin-react or @vitejs/plugin-react-swc are also manually added.

fix

Remove manual react plugin configuration. Use vite-react's react option instead.

affects: all

gotchaaliasFromTsconfig requires tsconfig.json to be in the project root and paths to be defined.

fix

Ensure tsconfig.json has paths configured correctly. Plugin watches tsconfig for changes.

affects: >=2.3.0

Errors

Common errors & fixes

Error: Cannot find module 'vite'

vite is a peer dependency and must be installed separately.

fix

Run 'npm install vite' or 'pnpm add vite'.

Error [ERR_REQUIRE_ESM]: require() of ES Module ... at Object.<anonymous> ...

Package is ESM-only since v4.0.0, but CommonJS require() was used.

fix

Use import syntax. Add 'type': 'module' to package.json, or rename file to .mjs.

TypeError: defineConfig is not a function

Importing from 'vite' instead of 'vite-react'

fix

Change import to: import { defineConfig } from 'vite-react'

Cannot find module '@vitejs/plugin-react-swc' or peer dependency not installed

vite-react internally uses @vitejs/plugin-react-swc but it may be missing if not installed as transitive dependency.

fix

Ensure vite-react is installed. If issues persist, manually install @vitejs/plugin-react-swc as devDependency.

Upgrade

Version history

5.0.0latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

9 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/geekact/vite-react ↗

packagehttps://www.npmjs.com/package/vite-react ↗