Registry / web-framework / react-native-windows

react-native-windows

library0.82.3jsnpmunverified

React Native for Windows (RNW) is a project maintained by Microsoft that extends the React Native framework to enable development for Universal Windows Platform (UWP) and Win32 applications. It provides a platform-specific rendering layer and native modules, allowing developers to build true native Windows user interfaces using JavaScript and TypeScript. The current stable version, 0.82.3, targets React Native 0.82.0, ensuring close feature parity with the core framework. Releases often track major React Native versions, with frequent preview and patch updates. Key differentiators include deep integration with Windows APIs and XAML UI components, support for both modern UWP and traditional Win32 desktop apps, and robust tooling for the Windows development environment, providing a pathway for cross-platform apps with a strong native Windows experience.

web-framework

npm install react-native-windows

github ↗package ↗homepage ↗

INSTALL

IMPORT

SIG · REACT-NATIVE-WINDO

react-native-windows

web-frameworkjavascriptv0.82.3

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.

App

✓ import App from './App';

Common entry point for a React Native application, typically defined in an `App.tsx` or `App.js` file.

View, Text, Button

✓ import { View, Text, Button } from 'react-native';

✗ import { View, Text, Button } from 'react-native-windows';

Most core components are imported directly from the `react-native` package, as `react-native-windows` provides the native implementation layer.

Platform

✓ import { Platform } from 'react-native';

Used to conditionally render Windows-specific UI or logic using `Platform.OS === 'windows'`.

WindowsDatePicker, Flyout

✓ import { WindowsDatePicker, Flyout } from 'react-native-windows';

Some Windows-specific components and APIs are directly exported by `react-native-windows` for deep platform integration.

This quickstart demonstrates a basic React Native Windows application, showcasing standard React Native components alongside a Windows-specific `WindowsDatePicker` to illustrate platform-specific UI integration and conditional rendering.

import React from 'react'; import { AppRegistry, StyleSheet, Text, View, Button, Platform } from 'react-native'; import { WindowsDatePicker } from 'react-native-windows'; const App = () => { const [count, setCount] = React.useState(0); const [selectedDate, setSelectedDate] = React.useState(new Date()); return ( <View style={styles.container}> <Text style={styles.header}>React Native Windows App</Text> <Text style={styles.welcome}>Welcome to your first Windows app!</Text> <Text>Count: {count}</Text> <Button title="Increment" onPress={() => setCount(count + 1)} /> {Platform.OS === 'windows' && ( <View style={styles.windowsSpecific}> <Text style={styles.platformText}>Windows-specific UI:</Text> <WindowsDatePicker date={selectedDate} onDateChange={setSelectedDate} style={styles.datePicker} /> <Text>Selected Date: {selectedDate.toDateString()}</Text> </View> )} </View> ); }; const styles = StyleSheet.create({ container: { flex: 1, justifyContent: 'center', alignItems: 'center', backgroundColor: '#F5FCFF', }, header: { fontSize: 24, fontWeight: 'bold', marginBottom: 10, }, welcome: { fontSize: 20, textAlign: 'center', margin: 10, }, windowsSpecific: { marginTop: 20, padding: 15, borderColor: '#ccc', borderWidth: 1, borderRadius: 5, alignItems: 'center', }, platformText: { fontSize: 16, marginBottom: 10, fontStyle: 'italic', }, datePicker: { width: 200, height: 50, marginBottom: 10 } }); AppRegistry.registerComponent('MyWindowsApp', () => App);

Debug

Known issues

breakingUpgrading to `react-native-windows` 0.82.x from previous major versions (e.g., 0.81.x) requires careful migration, especially if your project contains native module code or uses deprecated APIs. The project structure and build systems often evolve with major React Native releases.

fix

Refer to the official upgrade helper tool and documentation provided by Microsoft for `react-native-windows`. Typically, running `npx react-native upgrade` and then following specific `react-native-windows` upgrade steps for C++/C# projects is required. Pay close attention to changes in project files (`.csproj`, `.vcxproj`) and native module registration.

affects: >=0.82.0

breakingThe minimum Node.js version required for `react-native-windows` 0.82.x has been updated to `Node.js >= 22`.

fix

Ensure your development environment uses Node.js version 22 or higher. Use a Node.js version manager like `nvm` (Node Version Manager) to easily switch between versions if needed.

affects: >=0.82.0

gotchaDeveloping for React Native Windows often requires specific Windows SDKs, Visual Studio workloads (e.g., 'Desktop development with C++', 'Universal Windows Platform development'), and other native development tools to be correctly installed and configured. Missing components can lead to build failures.

fix

Consult the official React Native Windows environment setup guide. Verify that all required Visual Studio components, Windows SDKs, and build tools are installed. Running `react-native-windows-init` (if available for your version) or checking diagnostics can help identify missing prerequisites.

affects: >=0.60

breakingThe Fabric architecture, a re-architecture of React Native's rendering system, is being progressively adopted. This can introduce changes to how native modules are written and how UI components interact with the native layer, potentially breaking existing native module implementations or causing layout discrepancies.

fix

Review the React Native Fabric documentation for Windows and update any custom native modules or highly optimized UI components to align with Fabric's new architecture. Test existing layouts thoroughly, as rendering changes might affect visual fidelity.

affects: >=0.82.0

Errors

Common errors & fixes

error MSB8036: The Windows SDK version 10.0.X.0 was not found. Install the required version of Windows SDK or change the SDK version in the project property pages or by right-clicking the solution and selecting 'Retarget solution'.

The specific Windows SDK version required by the project (or defaulted to) is not installed on the development machine.

fix

Open Visual Studio Installer, modify your Visual Studio installation, and ensure the necessary Windows SDK version (e.g., 10.0.19041.0, 10.0.22000.0) is selected and installed under the 'Individual components' tab or via the 'Universal Windows Platform development' workload.

Error: Command failed: msbuild.exe build\MyApp.sln /p:Configuration=Debug /p:Platform=x64 ...

A generic build failure often due to incorrect Visual Studio configuration, missing dependencies, or C++/C# compilation errors within the native project.

fix

Examine the detailed output from `msbuild.exe` for specific C++ or C# compiler errors. Ensure Visual Studio workloads are correctly installed, and check for any custom native code or third-party native modules that might be causing issues. Try cleaning and rebuilding the solution from Visual Studio directly to get more immediate feedback.

Invariant Violation: 'main' has not been registered. This can happen if:

The `AppRegistry.registerComponent` call in your `index.js` (or similar entry file) either isn't being executed, or the module name provided doesn't match the name expected by the native host.

fix

Verify that your `AppRegistry.registerComponent('YourAppName', () => App)` call is present and correct in your entry file. Ensure that 'YourAppName' matches the name specified when your React Native Windows project was initialized, typically found in `app.json` and the native project configuration.

Upgrade

Version history

0.82.3latest on npm

Audit

Dependencies

reactrequiredPeer dependency for the React component model.

@types/reactoptionalPeer dependency for TypeScript type definitions for React.

react-nativerequiredCore React Native framework peer dependency.

Agent activity

4 hits · last 30 days

node

Resources

githubhttps://github.com/microsoft/react-native-windows ↗

packagehttps://www.npmjs.com/package/react-native-windows ↗

homepagehttps://microsoft.github.io/react-native-windows ↗