ERROR Invariant Violation: Tried to register two views with the same name RNCSafeAreaProvider, js engine: hermes

[Édio Melo]

ERROR Invariant Violation: Tried to register two views with the same name RNSVGRect, js engine: hermes

Android Bundled 8978ms (C:\Users\Mello\Documents\Builds\app-noah\apps\app-merchant\index.js)
LOG undefined undefined
ERROR Invariant Violation: Tried to register two views with the same name RNCSafeAreaProvider, js engine: hermes
ERROR Invariant Violation: "main" has not been registered. This can happen if:

• Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.
• A module failed to load due to an error and AppRegistry.registerComponent wasn't called., js engine: hermes

I can't understand the reason for the error above, my package settings related to svg are below:
"react-native": "0.73.6",
"react-native-screens": "3.29.0",
"react-native-safe-area-context": "^4.9.0",
"react-native-svg": "^13.14.0"

The error occurs when I open the expo go application (I have an svg on the welcome screen:

import BackgroundMerchant from "../../assets/img-entrar-merchant.svg";


export function BackgroundWelcomeMerchant() {
  return <BackgroundMerchant width={"100%"} height={"100%"} />;
}

react-app-env.d.ts:

declare module "*.svg" {
  import { SvgProps } from "react-native-svg";
  const content: React.FunctionComponent<SvgProps>;
  export default content;
}
declare module "react-native-url-polyfill/auto";

declare module "blob-polyfill --save";
declare module "react-native-dialog";
declare module "socket.io-client";
declare module "*.png";
// declare module "*.svg";
declare module "*.jpeg";
declare module "*.jpg";
declare module "*.ttf";

my metro.config.js

const { getDefaultConfig } = require("expo/metro-config");

module.exports = (() => {
  const config = getDefaultConfig(__dirname);

  const { transformer, resolver } = config;

  config.transformer = {
    ...transformer,
    babelTransformerPath: require.resolve("react-native-svg-transformer"),
  };
  config.resolver = {
    ...resolver,
    assetExts: resolver.assetExts.filter((ext) => ext !== "svg"),
    sourceExts: [...resolver.sourceExts, "svg"],
  };

  return config;
})();

my babel.config.js:

module.exports = function (api) {
  api.cache(true);
  return {
    presets: ["babel-preset-expo"],
    plugins: [
      ["module:react-native-dotenv"],
      ["react-native-reanimated/plugin"],
    ],
  };
};

[JP Strydom]

We're getting this same error on the latest Expo, but our issue gets fixed by downgrading from react-native-svg 15.2.0 (which is being recommended by expo) to 14.1.0.

Our env is as follows:

  expo-env-info 1.2.0 environment info:
    System:
      OS: Windows 11 10.0.22631
    Binaries:
      Node: 20.13.1 - C:\Program Files\nodejs\node.EXE
      npm: 10.8.1 - C:\Program Files\nodejs\npm.CMD
    IDEs:
      Android Studio: AI-222.4459.24.2221.9971841
    npmPackages:
      expo: ~51.0.14 => 51.0.14 
      react: 18.2.0 => 18.2.0 
      react-dom: 18.2.0 => 18.2.0 
      react-native: 0.74.2 => 0.74.2 
      react-native-web: ~0.19.11 => 0.19.12 
      react-native-svg: 15.2.0 => 15.2.0to cause the issue)
    Expo Workflow: managed

react-native-svg: 15.2.0 => 15.2.0
This version causes the issue. Downgrading to 14.1.0 fixes the issue. 14.2.0 also appears to cause the issue.

We've also tried deleting node_modules and package-lock.json and reinstalling our dependencies, but we still got the ERROR Invariant Violation: Tried to register two views with the same name RNSVGRect, js engine: hermes error

Hopefully this get's fixed soon because this is still the version expo recommends.

[Bohdan Artiukhov]

Hello @E-Mello @JPStrydom,
Could you share a simple example of how we can reproduce that issue?

[Édio Melo]

I don't know how to explain why, i simply stopped using svg and put png and the error stopped =/. I believe the problem is with the babel configuration and the use of svg, but, i didn't find anything specifc on the internet , or maybe i didn't know how to look for it.

[Bohdan Artiukhov]

@E-Mello,
Alright, we have closed that issue. If you have any further questions, please feel free to open a new issue.
Thank you.