Unable to resolve module missing-asset-registry-path #38282

MajidAziz3 · 2023-07-11T07:45:14Z

Description

error Unable to resolve module missing-asset-registry-path from path/src/assets/image.png: missing-asset-registry-path could not be found within the project or in these directories:
node_modules

1 | �PNG
2 |
3 |
4 | IHDRX^;I�sRGB��@IDATx�] |E֯��$܇�C<�UBeUTċ@D/�k=�UDv�o��..
Error: Unable to resolve module missing-asset-registry-path from path/src/assets/image.png: missing-asset-registry-path could not be found within the project or in these directories:

React Native Version

0.72.1

Output of `npx react-native info`

System:
OS: macOS 13.4
CPU: (4) x64 Intel(R) Core(TM) i5-7360U CPU @ 2.30GHz
Memory: 52.41 MB / 8.00 GB
Shell:
version: "5.9"
path: /bin/zsh
Binaries:
Node:
version: 20.2.0
path: /usr/local/bin/node
Yarn:
version: 1.22.19
path: /usr/local/bin/yarn
npm:
version: 9.6.6
path: /usr/local/bin/npm
Watchman:
version: 2023.05.22.00
path: /usr/local/bin/watchman
Managers:
CocoaPods:
version: 1.12.1
path: /Users/apple/.rubies/ruby-3.2.2/bin/pod
SDKs:
iOS SDK:
Platforms:
- DriverKit 22.4
- iOS 16.4
- macOS 13.3
- tvOS 16.4
- watchOS 9.4
Android SDK: Not Found
IDEs:
Android Studio: 2022.2 AI-222.4459.24.2221.9971841
Xcode:
version: 14.3.1/14E300c
path: /usr/bin/xcodebuild
Languages:
Java:
version: 17.0.7
path: /usr/bin/javac
Ruby:
version: 3.2.2
path: /Users/apple/.rubies/ruby-3.2.2/bin/ruby
npmPackages:
"@react-native-community/cli":
installed: 11.3.5
wanted: ^11.3.5
react:
installed: 18.2.0
wanted: 18.2.0
react-native:
installed: 0.72.1
wanted: 0.72.1
react-native-macos: Not Found
npmGlobalPackages:
"react-native": Not Found
Android:
hermesEnabled: true
newArchEnabled: false
iOS:
hermesEnabled: true
newArchEnabled: false

Steps to reproduce

Error coming while running Apk bundling commands npx react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

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

command for bundling assets: npx react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res

The text was updated successfully, but these errors were encountered:

blakef · 2023-07-11T09:36:06Z

Hi, we're going to need a bit more information to be helpful. Here are some things you can do in the interim to unblock yourself:

list your installed packages please, and confirm you're using the new @react-native/metro-config (might be worth reading @huntie's comment here: Cant bundle locally on port 8080 after init on 0.72.0-rc.0 and bug in the template #36730 (comment)).
take a look at the upgrade helper for the version you're moving to: https://react-native-community.github.io/upgrade-helper/?from=0.71.12&to=0.72.1

If you think this is a more general issue and not specific to your setup, can you provide a minimum reproducible example?

github-actions · 2023-07-11T09:36:34Z

⚠️	Missing Reproducible Example
ℹ️	It looks like your issue is missing a reproducible example. Please provide either: If your bug is UI related: a Snack If your bug is build/update related: use our Reproducer Template

MajidAziz3 · 2023-07-11T09:59:17Z

@blakef the project is too old , i am sure the issue is an metro.config , here is the config file , please have a look ,the issue is only with png images

module.exports = (async () => {
 const {
   resolver: { sourceExts, assetExts },
 } = await getDefaultConfig();

 return {
   transformer: {
     babelTransformerPath: require.resolve('react-native-svg-transformer'),
     getTransformOptions: async () => ({
       transform: {
         experimentalImportSupport: false,
         inlineRequires: false,
       },
     }),
   },
   resolver: {
     assetExts: assetExts.filter(ext => ext !== 'svg'),
     sourceExts: [...sourceExts, 'svg'],
   },
 };
})();

react-native Config File

module.exports = {
  project: {
    ios: {},
    android: {}, // grouped into "project"
  },
  assets: ["./src/assets/fonts/"], // stays the same
};

cortinico · 2023-07-11T10:49:40Z

Potentially related to react-navigation/react-navigation#11192

@MajidAziz3 without a repro we can't really help further.

huntie · 2023-07-11T11:11:48Z

@MajidAziz3 Your metro.config.js is in an incorrect format, please adapt to match the example here: facebook/metro#1028 (comment)

huntie · 2023-07-11T11:20:22Z

Duplicate of facebook/metro#1028.

KushalDesai1 · 2023-12-21T10:50:05Z

I had to downgrade react-native version from 0.73 to 0.68.

And node version from v20 to v16.20.0.

Leslie-Wong-H · 2023-12-21T10:58:53Z

I am facing this with jpg, yet png is fine.
react-native 0.72.8

Leslie-Wong-H · 2023-12-21T11:28:10Z

I am facing this with jpg, yet png is fine. react-native 0.72.8

This config works.

/**
 * Metro configuration for React Native
 * https://github.com/facebook/react-native
 *
 * @format
 */

const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config');

const defaultConfig = getDefaultConfig(__dirname);

const {
  resolver: { sourceExts, assetExts },
} = getDefaultConfig(__dirname);

const config = {
  transformer: {
    getTransformOptions: async () => ({
      transform: {
        experimentalImportSupport: false,
        inlineRequires: true,
      },
    }),
    babelTransformerPath: require.resolve('react-native-svg-transformer'),
  },
  resolver: {
    assetExts: assetExts.filter(ext => ext !== 'svg'),
    sourceExts: [...sourceExts, 'svg'],
  },
};

module.exports = mergeConfig(defaultConfig, config);

leorodriguesdev · 2024-01-10T17:48:14Z

@Leslie-Wong-H thank you, you saved me

santiagoquintero95 · 2024-01-19T21:42:20Z

I am facing this with jpg, yet png is fine. react-native 0.72.8

This config works.

/**
 * Metro configuration for React Native
 * https://github.com/facebook/react-native
 *
 * @format
 */

const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config');

const defaultConfig = getDefaultConfig(__dirname);

const {
  resolver: { sourceExts, assetExts },
} = getDefaultConfig(__dirname);

const config = {
  transformer: {
    getTransformOptions: async () => ({
      transform: {
        experimentalImportSupport: false,
        inlineRequires: true,
      },
    }),
    babelTransformerPath: require.resolve('react-native-svg-transformer'),
  },
  resolver: {
    assetExts: assetExts.filter(ext => ext !== 'svg'),
    sourceExts: [...sourceExts, 'svg'],
  },
};

module.exports = mergeConfig(defaultConfig, config);

Omg finally it works. I was using an old config and I moved to react native 7.3.0 and this update is required or the archive will fail

zhairui · 2024-01-25T08:38:38Z

I meet an error , pls help . thanks ! here is the error stack:

[TypeError: _$$_REQUIRE(_dependencyMap[7], "(...)ssets-registry/path-support.js") is not a function (it is Object)] {"componentStack": "
in BaseImage (created by ImageBackground)
in RCTView (created by View)
in View (created by ImageBackground)
....

ShivBhanKushWaha · 2024-02-09T07:31:51Z

error: Error: Unable to resolve module missing-asset-registry-path from D:\Hoverin Aerospace\HoverinApp\node_modules\react-native\Libraries\LogBox\UI\LogBoxImages\close.png: missing-asset-registry-path could not be found within the project or in these directories:
node_modules\react-native\node_modules
node_modules

1 | �PNG
2 | →
3 |
4 | IHDR∟♦�♦↨▼�IDATxڝՅ
at ModuleResolver.resolveDependency (D:\Hoverin Aerospace\HoverinApp\node_modules\metro\src\node-haste\DependencyGraph\ModuleResolution.js:153:15)
at DependencyGraph.resolveDependency (D:\Hoverin Aerospace\HoverinApp\node_modules\metro\src\node-haste\DependencyGraph.js:271:43)
at D:\Hoverin Aerospace\HoverinApp\node_modules\metro\src\lib\transformHelpers.js:176:21
at resolveDependencies (D:\Hoverin Aerospace\HoverinApp\node_modules\metro\src\DeltaBundler\buildSubgraph.js:56:25)
at visit (D:\Hoverin Aerospace\HoverinApp\node_modules\metro\src\DeltaBundler\buildSubgraph.js:107:30)
at async Promise.all (index 12)
at async visit (D:\Hoverin Aerospace\HoverinApp\node_modules\metro\src\DeltaBundler\buildSubgraph.js:116:5)
at async Promise.all (index 5)
at async visit (D:\Hoverin Aerospace\HoverinApp\node_modules\metro\src\DeltaBundler\buildSubgraph.js:116:5)
at async Promise.all (index 15)
how to fix this issue

alexdarh · 2024-02-13T08:52:30Z

error: Error: Unable to resolve module missing-asset-registry-path from D:\Hoverin Aerospace\HoverinApp\node_modules\react-native\Libraries\LogBox\UI\LogBoxImages\close.png: missing-asset-registry-path could not be found within the project or in these directories: node_modules\react-native\node_modules node_modules

1 | �PNG
2 | →
3 |
4 | IHDR∟♦�♦↨▼�IDATxڝՅ
at ModuleResolver.resolveDependency (D:\Hoverin Aerospace\HoverinApp\node_modules\metro\src\node-haste\DependencyGraph\ModuleResolution.js:153:15)
at DependencyGraph.resolveDependency (D:\Hoverin Aerospace\HoverinApp\node_modules\metro\src\node-haste\DependencyGraph.js:271:43)
at D:\Hoverin Aerospace\HoverinApp\node_modules\metro\src\lib\transformHelpers.js:176:21
at resolveDependencies (D:\Hoverin Aerospace\HoverinApp\node_modules\metro\src\DeltaBundler\buildSubgraph.js:56:25)
at visit (D:\Hoverin Aerospace\HoverinApp\node_modules\metro\src\DeltaBundler\buildSubgraph.js:107:30)
at async Promise.all (index 12)
at async visit (D:\Hoverin Aerospace\HoverinApp\node_modules\metro\src\DeltaBundler\buildSubgraph.js:116:5)
at async Promise.all (index 5)
at async visit (D:\Hoverin Aerospace\HoverinApp\node_modules\metro\src\DeltaBundler\buildSubgraph.js:116:5)
at async Promise.all (index 15)
how to fix this issue
same error

PavelVisme · 2024-02-14T03:42:37Z

same error after upgrading to expo50

Unable to resolve "missing-asset-registry-path" from "../../node_modules/.pnpm/react-native@0.73.4_@babel+core@7.23.3_@babel+preset-env@7.23.3_react@18.2.0/node_modules/react-native/Libraries/LogBox/UI/LogBoxImages/close.png"

This is example with almost empty index.js file

DeabitTech · 2024-02-20T15:14:07Z

but why there are a lot of issues about the upgrading of expo 50? @expo please fix it

uoon-dev · 2024-03-25T15:49:28Z

(Expo SDK 50) Every solution didn't work for me, but I solved missing-asset-registry-path issue by below custom metro config.

// Learn more https://docs.expo.io/guides/customizing-metro
const { getDefaultConfig } = require('expo/metro-config');

/** @type {import('expo/metro-config').MetroConfig} */
const config = getDefaultConfig(__dirname);

config.transformer = {
  ...config.transformer,
  babelTransformerPath: require.resolve('react-native-svg-transformer'),
  assetPlugins: ['expo-asset/tools/hashAssetFiles'],
  getTransformOptions: async () => ({
    transform: {
      experimentalImportSupport: false,
      inlineRequires: true,
    },
  }),
};
//
config.resolver = {
  ...config.resolver,
  assetExts: config.resolver.assetExts.filter((ext) => ext !== 'svg'),
  sourceExts: [...config.resolver.sourceExts, 'svg', 'd.ts'],
};

module.exports = config;

Tusharatha7 · 2024-04-10T17:45:48Z

with png. none of the above metroconfig is working for. what can i do?

Unable to resolve "./assets/logo.png" from "screens\Startscreen.js"

ch3njust1n · 2024-05-11T13:55:23Z

(Expo SDK 50) Every solution didn't work for me, but I solved missing-asset-registry-path issue by below custom metro config.

// Learn more https://docs.expo.io/guides/customizing-metro
const { getDefaultConfig } = require('expo/metro-config');

/** @type {import('expo/metro-config').MetroConfig} */
const config = getDefaultConfig(__dirname);

config.transformer = {
  ...config.transformer,
  babelTransformerPath: require.resolve('react-native-svg-transformer'),
  assetPlugins: ['expo-asset/tools/hashAssetFiles'],
  getTransformOptions: async () => ({
    transform: {
      experimentalImportSupport: false,
      inlineRequires: true,
    },
  }),
};
//
config.resolver = {
  ...config.resolver,
  assetExts: config.resolver.assetExts.filter((ext) => ext !== 'svg'),
  sourceExts: [...config.resolver.sourceExts, 'svg', 'd.ts'],
};

module.exports = config;

This worked for me! Thank you!

KStockton · 2024-05-28T17:48:16Z

(Expo SDK 50) Every solution didn't work for me, but I solved missing-asset-registry-path issue by below custom metro config.

// Learn more https://docs.expo.io/guides/customizing-metro
const { getDefaultConfig } = require('expo/metro-config');

/** @type {import('expo/metro-config').MetroConfig} */
const config = getDefaultConfig(__dirname);

config.transformer = {
  ...config.transformer,
  babelTransformerPath: require.resolve('react-native-svg-transformer'),
  assetPlugins: ['expo-asset/tools/hashAssetFiles'],
  getTransformOptions: async () => ({
    transform: {
      experimentalImportSupport: false,
      inlineRequires: true,
    },
  }),
};
//
config.resolver = {
  ...config.resolver,
  assetExts: config.resolver.assetExts.filter((ext) => ext !== 'svg'),
  sourceExts: [...config.resolver.sourceExts, 'svg', 'd.ts'],
};

module.exports = config;

This worked for me! Thank you!

This worked for me as well.

haidernayyar · 2024-05-28T21:38:39Z

I am facing this with jpg, yet png is fine. react-native 0.72.8

This config works.

/**
 * Metro configuration for React Native
 * https://github.com/facebook/react-native
 *
 * @format
 */

const { getDefaultConfig, mergeConfig } = require('@react-native/metro-config');

const defaultConfig = getDefaultConfig(__dirname);

const {
  resolver: { sourceExts, assetExts },
} = getDefaultConfig(__dirname);

const config = {
  transformer: {
    getTransformOptions: async () => ({
      transform: {
        experimentalImportSupport: false,
        inlineRequires: true,
      },
    }),
    babelTransformerPath: require.resolve('react-native-svg-transformer'),
  },
  resolver: {
    assetExts: assetExts.filter(ext => ext !== 'svg'),
    sourceExts: [...sourceExts, 'svg'],
  },
};

module.exports = mergeConfig(defaultConfig, config);

This worked for me and remember to re-start the metro

quotentiroler · 2024-06-02T19:27:27Z

I cannot get over this issue for png files after updating to expo sdk 51 :(

meshboy88 · 2024-06-05T10:20:21Z

(Expo SDK 50) Every solution didn't work for me, but I solved missing-asset-registry-path issue by below custom metro config.

// Learn more https://docs.expo.io/guides/customizing-metro
const { getDefaultConfig } = require('expo/metro-config');

/** @type {import('expo/metro-config').MetroConfig} */
const config = getDefaultConfig(__dirname);

config.transformer = {
  ...config.transformer,
  babelTransformerPath: require.resolve('react-native-svg-transformer'),
  assetPlugins: ['expo-asset/tools/hashAssetFiles'],
  getTransformOptions: async () => ({
    transform: {
      experimentalImportSupport: false,
      inlineRequires: true,
    },
  }),
};
//
config.resolver = {
  ...config.resolver,
  assetExts: config.resolver.assetExts.filter((ext) => ext !== 'svg'),
  sourceExts: [...config.resolver.sourceExts, 'svg', 'd.ts'],
};

module.exports = config;

Bro, you made my day. Thanks, it worked for the png issue!

MajidAziz3 added the Needs: Triage 🔍 label Jul 11, 2023

github-actions bot added the 📦Bundler label Jul 11, 2023

blakef added Needs: Author Feedback Needs: Repro This issue could be improved with a clear list of steps to reproduce the issue. and removed Needs: Triage 🔍 labels Jul 11, 2023

github-actions bot added Needs: Attention Issues where the author has responded to feedback. and removed Needs: Author Feedback labels Jul 11, 2023

cortinico added Needs: Author Feedback and removed Needs: Attention Issues where the author has responded to feedback. labels Jul 11, 2023

huntie closed this as completed Jul 11, 2023

dancosta-fed mentioned this issue Jan 30, 2024

Missing-asset-registry-path for @react-navigation/elements/lib/commonjs/assets/back-icon-mask.png on RN 70.6 react-navigation/react-navigation#11192

Closed

14 tasks

Anush-Shand mentioned this issue Mar 7, 2024

Task/sdk 3710/support v6.1.0 CleverTap/clevertap-react-native#378

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Unable to resolve module missing-asset-registry-path #38282

Unable to resolve module missing-asset-registry-path #38282

MajidAziz3 commented Jul 11, 2023

blakef commented Jul 11, 2023

github-actions bot commented Jul 11, 2023

MajidAziz3 commented Jul 11, 2023 •

edited by huntie

Loading

cortinico commented Jul 11, 2023

huntie commented Jul 11, 2023

huntie commented Jul 11, 2023

KushalDesai1 commented Dec 21, 2023

Leslie-Wong-H commented Dec 21, 2023

Leslie-Wong-H commented Dec 21, 2023

leorodriguesdev commented Jan 10, 2024

santiagoquintero95 commented Jan 19, 2024

zhairui commented Jan 25, 2024

ShivBhanKushWaha commented Feb 9, 2024

alexdarh commented Feb 13, 2024

PavelVisme commented Feb 14, 2024 •

edited

Loading

DeabitTech commented Feb 20, 2024

uoon-dev commented Mar 25, 2024

Tusharatha7 commented Apr 10, 2024

ch3njust1n commented May 11, 2024

KStockton commented May 28, 2024

haidernayyar commented May 28, 2024

quotentiroler commented Jun 2, 2024

meshboy88 commented Jun 5, 2024

Unable to resolve module missing-asset-registry-path #38282

Unable to resolve module missing-asset-registry-path #38282

Comments

MajidAziz3 commented Jul 11, 2023

Description

React Native Version

Output of npx react-native info

Steps to reproduce

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

blakef commented Jul 11, 2023

github-actions bot commented Jul 11, 2023

MajidAziz3 commented Jul 11, 2023 • edited by huntie Loading

cortinico commented Jul 11, 2023

huntie commented Jul 11, 2023

huntie commented Jul 11, 2023

KushalDesai1 commented Dec 21, 2023

Leslie-Wong-H commented Dec 21, 2023

Leslie-Wong-H commented Dec 21, 2023

leorodriguesdev commented Jan 10, 2024

santiagoquintero95 commented Jan 19, 2024

zhairui commented Jan 25, 2024

ShivBhanKushWaha commented Feb 9, 2024

alexdarh commented Feb 13, 2024

PavelVisme commented Feb 14, 2024 • edited Loading

DeabitTech commented Feb 20, 2024

uoon-dev commented Mar 25, 2024

Tusharatha7 commented Apr 10, 2024

ch3njust1n commented May 11, 2024

KStockton commented May 28, 2024

haidernayyar commented May 28, 2024

quotentiroler commented Jun 2, 2024

meshboy88 commented Jun 5, 2024

Output of `npx react-native info`

MajidAziz3 commented Jul 11, 2023 •

edited by huntie

Loading

PavelVisme commented Feb 14, 2024 •

edited

Loading