{"id":22807,"library":"vite-plugin-react","title":"vite-plugin-react","description":"Official Vite plugin providing React Fast Refresh support, version 4.0.1. Release cadence follows Vite major releases. Key differentiator: default in create-vite-app React template, first-party support from Vite team. Alternative to react-refresh-webpack-plugin, with native ESM and HMR integration.","status":"active","version":"4.0.1","language":"javascript","source_language":"en","source_url":"https://github.com/vitejs/vite-plugin-react","tags":["javascript","vite","react","hmr"],"install":[{"cmd":"npm install vite-plugin-react","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-react","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-react","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency, version >=1.0.0-rc.13","package":"vite","optional":false}],"imports":[{"note":"Default export, also works with require in CJS but prefer import.","wrong":"const react = require('vite-plugin-react')","symbol":"default","correct":"import react from 'vite-plugin-react'"},{"note":"Named export for advanced usage, not commonly used.","wrong":"","symbol":"createPlugin","correct":"import { createPlugin } from 'vite-plugin-react'"},{"note":"Exact name of the HMR plugin.","wrong":"import { fastRefresh } from 'vite-plugin-react'","symbol":"reactFastRefresh","correct":"import { reactFastRefresh } from 'vite-plugin-react'"}],"quickstart":{"code":"// vite.config.js\nimport { defineConfig } from 'vite';\nimport react from 'vite-plugin-react';\n\nexport default defineConfig({\n  plugins: [react()]\n});","lang":"javascript","description":"Configures Vite with React Fast Refresh using the vite-plugin-react plugin."},"warnings":[{"fix":"Update Vite to >=1.0.0-rc.13.","message":"vite-plugin-react requires Vite >=1.0.0-rc.13. Using older versions will cause errors.","severity":"breaking","affected_versions":">=0.0.0"},{"fix":"Remove `jsx: 'react'` from vite.config.js.","message":"The `jsx: 'react'` config option is no longer needed in Vite 2+.","severity":"deprecated","affected_versions":">=2.0.0"},{"fix":"Use Vite's default esbuild for JSX or add @vitejs/plugin-react-refresh separately.","message":"This plugin does not provide Babel transforms; ensure your project already handles JSX via Vite's built-in support.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Run `npm install vite-plugin-react`.","cause":"Package not installed or missing dependencies.","error":"Cannot find module 'vite-plugin-react'"},{"fix":"Ensure you import default export: `import react from 'vite-plugin-react'` and call it as `react()`.","cause":"Incorrect import or usage in vite.config.js","error":"TypeError: react is not a function"},{"fix":"Upgrade React to >=16.8.0.","cause":"Using React <16.8.0 without Hooks support.","error":"Uncaught Error: [vite-plugin-react] React Fast Refresh requires a React version that supports hooks."}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}