Edit

Using react-native-windows NuGet packages

This documentation and the underlying platform code is a work in progress.

The default for react-native-windows has been to build all code from source. This includes building all the code shipped by the react-native-windows team in the npm package from source. This code can be quite large and take a long time to build as well as require a high-performance computer. Some configurations have problems building this code with only 8 GB of memory. Especially if you are used to working only with managed code, this can be a big surprise.

Starting with version 0.64 the team offers experimental NuGet packages that can be used as a replacement of compiling the sources.

Disclaimer: There are known compatibility issues with community modules, as they still rely on building the shared code from source. So the solution still needs to have all the source projects which puts all the build performance problems back.

Disclaimer: NuGet packages are not compatible with experimental feature WinUI 3.

The benefit of using NuGet packages is that you get improved compilation times for your Windows project and can develop on a less powerful computer.

The other benefit will be that it will be easier to update your projects to future versions or react-native-windows.

How to enable on new projects

When you enable react-native-windows on your new project, you can pass --experimentalNuGetDependency true:

1. npx react-native init <projectName>
2. pushd <projectName>
3. npx react-native-windows-init --overwrite --experimentalNuGetDependency true

Of course all the other flags still work.

How to update a previously created project

Note: It may be easier to attempt upgrading your app with react-native-windows-init as if it were a new project (described above), to get the correct changes applied to your project. See Upgrading App to Latest Version of React Native Windows. Otherwise, you can try applying the manual steps below.

C# projects

C++ projects

1. Update the solution file windows\<projectName>.sln:

   1. Open the project in Visual Studio
   2. Remove all projects except your own app project

2. Edit the file windows\ExperimentalFeatures.props

   1. Set the following to true

      <UseExperimentalNuGet>true</UseExperimentalNuGet>
      

3. Edit the project file windows\<projectName>\<projectName.csproj>

   1. Remove any <ProjectReference> or <PackageReference> references for Microsoft.ReactNative.* projects.

4. Update the C# logic for the new compile-time C# codeGen

Note: Starting with version 0.68, React Native for Windows apps use PackageReferences for native C++ NuGet dependencies. See Managing C++ dependencies about migrating away from use the older, packages.config for managing NuGet dependencies.

1. Update the solution file windows\<projectName>.sln:
   1. Open the project in Visual Studio
   2. Remove all projects that are not your project
2. Edit the file windows\ExperimentalFeatures.props
   1. Set the following to true

      <UseExperimentalNuGet>true</UseExperimentalNuGet>
      

3. Edit the project file windows\<projectName>\<projectName.vcxproj>
   1. Remove any <ProjectReference> or <PackageReference> references for Microsoft.ReactNative.* projects.

Version match

The versions of the NuGet package in your project must match the npm package version. If you need to update the NuGet packages there is a separate page on Updating NuGet packages