requireNativeComponent: "RCTWebView" was not found in the UIManager.

[Darkproduct]

Problem Description

Next iteration of #7758 & #7793

Steps To Reproduce

1. npm install react-native-webview
2. Add a webview element:

   import { WebView } from 'react-native-webview';
   <WebView source={{ uri: 'https://reactnative.dev/' }} style={{ flex: 1 }} />

3. npx react-native run-windows

Expected Results

I expect a webview with the react native web page displayed. Instead, I get the "RCTWebView not found" error.

CLI version

13.6.6

Environment

$ npx react-native info
info Fetching system and libraries information...
(node:17360) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
(Use `node --trace-deprecation ...` to show where the warning was created)
System:
  OS: Windows 10 10.0.19045
  CPU: (20) x64 12th Gen Intel(R) Core(TM) i7-12700
  Memory: 15.75 GB / 31.71 GB
Binaries:
  Node:
    version: 22.2.0
    path: C:\Program Files\nodejs\node.EXE
  Yarn: Not Found
  npm:
    version: 10.8.0
    path: C:\Program Files\nodejs\npm.CMD
  Watchman: Not Found
SDKs:
  Android SDK: Not Found
  Windows SDK:
    AllowDevelopmentWithoutDevLicense: Enabled
    AllowAllTrustedApps: Enabled
    Versions:
      - 10.0.19041.0
      - 10.0.22000.0
      - 10.0.22621.0
IDEs:
  Android Studio: Not Found
  Visual Studio:
    - 17.10.34916.146 (Visual Studio Professional 2022)
Languages:
  Java: Not Found
  Ruby: Not Found
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.2.0
    wanted: 18.2.0
  react-native:
    installed: 0.74.1
    wanted: 0.74.1
  react-native-windows:
    installed: 0.74.6
    wanted: 0.74.6
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found

Target Platform Version

10.0.19041

Target Device(s)

Desktop

Visual Studio Version

Visual Studio 2022

Build Configuration

Debug

Snack, code example, screenshot, or link to a repository

No response

[Darkproduct]

More info that was requested in the previous iterations of this error:

Versions:

"react": "18.2.0",
"react-native": "0.74.1",
"react-native-webview": "13.10.2",
"react-native-windows": "0.74.6"

$ npx react-native autolink-windows --logging
 ℹ Running x64 node on a x64 machine
(node:9476) [DEP0040] DeprecationWarning: The `punycode` module is deprecated. Please use a userland alternative instead.
(Use `node --trace-deprecation ...` to show where the warning was created)
⠋ Auto-linking...
Parsing project...
Found Windows app project, config:
{
  folder: '<Path>\\App',
  sourceDir: 'windows',
  solutionFile: 'App.sln',
  project: {
    projectFile: 'App\\App.vcxproj',
    projectName: 'App',
    projectLang: 'cpp',
    projectGuid: '{7e27a41e-cd94-498f-b937-b3ae5d119c84}'
  },
  experimentalFeatures: {
    UseHermes: 'true',
    UseWinUI3: 'false',
    UseExperimentalNuget: 'false',
    ReactExperimentalFeaturesSet: 'true'
  }
}
Parsing dependencies...
react-native-webview has Windows implementation, config:
{
  folder: '<Path>\\App\\node_modules\\react-native-webview',
  projects: [
    {
      projectFile: 'ReactNativeWebView\\ReactNativeWebView.vcxproj',
      directDependency: true,
      projectName: 'ReactNativeWebView',
      projectLang: 'cpp',
      projectGuid: '{00AA3765-C6A0-4713-B3F9-BFE47B9C83F5}',
      cppHeaders: [Array],
      cppPackageProviders: [Array],
      csNamespaces: [Array],
      csPackageProviders: [Array]
    }
  ],
  solutionFile: 'ReactNativeWebView.sln',
  nugetPackages: [],
  sourceDir: 'windows'
}
Adding react-native-webview.
Calculating AutolinkedNativeModules.g.cpp...
Reading AutolinkedNativeModules.g.cpp...
 ⠙ Auto-linking...AutolinkedNativeModules.g.cpp needs to be updated.
Writing AutolinkedNativeModules.g.cpp...
Calculating AutolinkedNativeModules.g.props...
Reading AutolinkedNativeModules.g.props...
No changes to AutolinkedNativeModules.g.props.
Calculating AutolinkedNativeModules.g.targets...
Reading AutolinkedNativeModules.g.targets...
AutolinkedNativeModules.g.targets needs to be updated.
Writing AutolinkedNativeModules.g.targets...
Calculating App.sln changes...
Processing ReactNativeWebView.vcxproj...
Missing project entry block, inserting.
Missing Debug|x64 config block.
Missing Debug|x64 config block.
Missing Debug|Win32 config block.
Missing Debug|Win32 config block.
Missing Debug|ARM64 config block.
Missing Debug|ARM64 config block.
Missing Release|x64 config block.
Missing Release|x64 config block.
Missing Release|Win32 config block.
Missing Release|Win32 config block.
Missing Release|ARM64 config block.
Missing Release|ARM64 config block.
App.sln needs to be updated.
Writing changes to App.sln...
 ✔ Auto-linking...
Success: Auto-linking changes completed. (108ms)

[jonthysell]

@TatianaKapos can you see if this works with a new project? Pretty sure we have it working in Gallery.

[TatianaKapos]

@jonthysell tested on a new app on version 0.74.7, everything works for me! We also have a working example in Gallery.

@Darkproduct I noticed you don't have yarn installed, can you go through these steps to make sure you have all the development dependencies? https://microsoft.github.io/react-native-windows/docs/rnw-dependencies

[microsoft-github-policy-service[bot]]

This issue has been automatically marked as stale because it has been marked as requiring author feedback but has not had any activity for 7 days. It will be closed if no further activity occurs within 7 days of this comment.