Registry / web-framework / babel-plugin-expo-web

babel-plugin-expo-web

library0.0.14jsnpmunverified

A Babel plugin that aliases `react-native` to `react-native-web` during build, enabling reuse of React Native components for web applications. Current stable version 0.0.14. It selectively rewrites imports to pull only required modules, reducing bundle size. Compared to alternatives like `react-native-web` alone, this plugin automates the alias and tree-shaking, integrating seamlessly into Babel configuration. Released under MIT license, actively used in Expo projects, with regular updates following `react-native-web` releases.

web-framework

npm install babel-plugin-expo-web

github ↗package ↗

INSTALL

IMPORT

SIG · BABEL-PLUGIN-EXPO-

babel-plugin-expo-web

web-frameworkjavascriptv0.0.14

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

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

plugin

✓ // .babelrc { "plugins": ["react-native-web"] }

✗ // Incorrect: using require syntax in config module.exports = { plugins: ['babel-plugin-react-native-web'] }

Plugin name is 'react-native-web' (not 'babel-plugin-react-native-web') in .babelrc plugins array.

Set up the Babel plugin to alias react-native to react-native-web, enabling a simple React Native component to render on web.

// Install yarn add --dev babel-plugin-react-native-web react-native-web // .babelrc { "plugins": ["react-native-web"] } // App.js import { View, Text } from 'react-native'; export default function App() { return ( <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}> <Text>Hello, Web!</Text> </View> ); }

Debug

Known issues

gotchaThe plugin rewrites imports to internal react-native-web paths (e.g., 'react-native-web/dist/exports/StyleSheet'). Do not depend on these paths directly as they are unstable.

fix

Always use the Babel plugin to handle aliasing; never import from react-native-web/dist directly.

affects: all

gotchaThe plugin name in .babelrc is 'react-native-web' not 'babel-plugin-react-native-web'. Using incorrect name will not transform imports.

fix

Use 'react-native-web' as the plugin string in your Babel configuration.

affects: all

Errors

Common errors & fixes

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

Missing runtime dependency react-native-web.

fix

Run 'yarn add react-native-web' to install the required package.

Upgrade

Version history

0.0.14latest on npm

Audit

Dependencies

react-native-webrequiredRuntime peer dependency; the plugin aliases react-native to react-native-web, which must be installed.

Agent activity

12 hits · last 30 days

node

Amazon

OpenAI (training)

Resources

githubhttps://github.com/raarts/expo-web ↗

packagehttps://www.npmjs.com/package/babel-plugin-expo-web ↗