Vite Plugin for React Native Web

0.0.11 verified Sat Apr 25 auth: no javascript

Vite plugin for React Native Web (RNW) that integrates RNW with Vite's dev server and build pipeline. Current stable version is 0.0.11, with active development. Release cadence is irregular. Key differentiators: provides HMR for RNW components, handles CSS-in-JS processing, and supports multiple Vite versions (4, 5, 6, 7, 8). Unlike other solutions, it directly applies RNW-specific config while leveraging Vite's React plugin. Requires react-native-web, TypeScript 5+, and Vite 4+. Includes expo-modules-core compatibility plugin since v0.0.8.

Common errors

error Error: Module not found: Can't resolve 'react-native-web' ↓

cause Missing peer dependency react-native-web

fix

npm install react-native-web

error TypeError: reactNativeWebPlugin is not a function ↓

cause Incorrect import: using require() or wrong import path

fix

Use import reactNativeWebPlugin from 'vite-plugin-rnw'

error Cannot find module 'vite-plugin-rnw' ↓

cause Plugin not installed

fix

npm install vite-plugin-rnw

Warnings

breaking v0.0.8 changes plugin API: now uses Vite's React plugin directly; old config may break ↓

fix Remove duplicate react() plugin from vite config; rely on reactNativeWebPlugin to handle it

deprecated Plugin depends on 'react-native-web' peer; install manually ↓

fix Run 'npm install react-native-web' along with the plugin

gotcha Plugin is ESM-only; CommonJS require() fails ↓

fix Use import syntax or set type: 'module' in package.json

gotcha TypeScript 5+ is required; older versions can't read plugin types ↓

fix Upgrade TypeScript to version 5 or higher

Install

npm install vite-plugin-rnw

yarn add vite-plugin-rnw

pnpm add vite-plugin-rnw

Imports

reactNativeWebPlugin

wrong

const reactNativeWebPlugin = require('vite-plugin-rnw')

correct

import reactNativeWebPlugin from 'vite-plugin-rnw'

Plugin is ESM-only; require() fails. Use default import.

expoModulesCoreFixPlugin

wrong

import expoModulesCoreFixPlugin from 'vite-plugin-rnw'

correct

import { expoModulesCoreFixPlugin } from 'vite-plugin-rnw'

Named export for Expo compatibility; default export is reactNativeWebPlugin only.

Types

wrong

const VitePluginRnwOptions = require('vite-plugin-rnw').VitePluginRnwOptions

correct

import type { VitePluginRnwOptions } from 'vite-plugin-rnw'

Type imports are available; runtime usage of the type is a common error.

Quickstart

Shows minimal setup to add the RNW plugin to a Vite config file.

import { defineConfig } from 'vite';
import reactNativeWebPlugin from 'vite-plugin-rnw';

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