React-Native metro bundler can't serve any file

Question

The metro bundler can resolve the dependencies graph(the app starts in emulator) but can't resolve any assets so all images in the app are missing.

This problem happens only after I upgraded from [email protected] to 0.59

Looking for JS files in
   /Users/name/app/MyApp/artifacts
   /Users/name/app/MyApp/node_modules

warning: the transform cache was reset.
Loading dependency graph, done.
 DELTA  [android, dev] artifacts/index.js ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓ 100.0% (2921/2921), done.

 MAP  [android, dev] artifacts/index.js ▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓▓ 100.0% (1/1), done.


::ffff:127.0.0.1 - - [30/Aug/2019:06:27:17 +0000] "GET /node_modules/my-assets/artifacts/assets/images/Logo.png?platform=android&hash=someHash HTTP/1.1" 404 221 "-" "okhttp/3.12.1"

^^^ issue appears on navigating to any view that contains <Image source=... />

The module my-assets does exist and contains all assets needed

To start: node node_modules/react-native/local-cli/cli.js start --reset-cache --projectRoot artifacts

The artifacts contains transpiled .js code from .ts

My file structure looks like this

.
├── artifacts # transpiled js files
├── node_modules #npm modules
└── src # ts files

bundler server output

metro.config.js

module.exports = {
    watchFolders: [path.join(__dirname, 'node_modules')],
    transformer: {
        getTransformOptions: async () => ({
            transform: {
                experimentalImportSupport: false,
                inlineRequires: false
            }
        })
    },
    resolver: {
        blacklistRE: blacklist([       /node_modules\/.*\/node_modules\/react-native\/.*/]),
        assetRegistryPath: path.resolve('node_modules/react-native/Libraries/Image/AssetRegistry')
    }
}

dependencies:

[email protected] /Users/name/app/MyApp
├── [email protected]  extraneous
└─┬ [email protected]
  └─┬ @react-native-community/[email protected]
    ├── [email protected]
    └─┬ [email protected]
      └── [email protected]  deduped

I also tried goto url in browser but also go 404 for both following request

http://localhost:8081/node_modules/my-assets/artifacts/assets/images/Logo.png?platform=android&hash=someHash

http://localhost:8081/node_modules/metro/src/Bundler/util.js # request to any js file also return 404

-- update --

Cleaning cache and removing $TMPDIR does not help

Answer 1

Try to clean your cache and try again

rm -rf $TMPDIR/react-native-packager-cache-*
rm -rf $TMPDIR/metro-bundler-cache-* 
rm -rf $TMPDIR/haste-*;
yarn cache clean