3
votes

Le bundler Metro React-Native ne peut servir aucun fichier

Le bundler metro peut résoudre le graphique des dépendances (l'application démarre dans l'émulateur) mais ne peut résoudre aucun élément, donc toutes les images de l'application sont manquantes.

Ce problème ne se produit qu'après la mise à niveau de react-native@0.57 à 0.59

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

^^^ un problème apparaît lors de la navigation vers n'importe quelle vue contenant strong>

Le module my-assets existe et contient tous les assets nécessaires

Pour démarrer: node node_modules / react-native / local- cli / cli.js start --reset-cache --projectRoot artefacts

Les artefacts contiennent du code .js transpilé de .ts

Ma structure de fichiers ressemble à ceci

my-app@1.0 /Users/name/app/MyApp
├── metro@0.48.5  extraneous
└─┬ react-native@0.59.4
  └─┬ @react-native-community/cli@1.11.2
    ├── metro@0.51.1
    └─┬ metro-config@0.51.1
      └── metro@0.51.1  deduped

Sortie du serveur de bundler

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')
    }
}

dépendances:

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

J'ai aussi essayé goto url dans le navigateur mais aussi aller 404 pour les deux requêtes suivantes p >

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"

- mise à jour -

Nettoyer le cache et supprimer $ TMPDIR n'aide pas


0 commentaires

3 Réponses :


1
votes

Essayez de nettoyer votre cache et réessayez

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


0 commentaires

0
votes

Veuillez essayer cette commande

npm cache clean


0 commentaires

0
votes

Je vois une notification, puis j'ai réalisé que j'avais déjà posé cette question

Je ne me souviens pas comment ai-je compris cela, mais dans mon message de validation, ceci issue me vient à l'esprit, et ils l'ont mentionné à comment :

Très bientôt, nous voulons forcer tous les dossiers de surveillance à être à l'intérieur de la racine du projet de metro, de cette façon Metro peut utiliser en toute sécurité la racine du projet comme racine du serveur http qui fournit les ressources et cela résoudra ce problème p >


Pour résoudre ce problème, j'ai dû changer la structure de mes fichiers de

.
├── artifacts
├── index.js # added this root level entry file
├── node_modules
├── src
│   ├── index.ts

À:

.
├── artifacts
├── node_modules
├── package.json
├── src
│   ├── index.ts


0 commentaires