web-dev-qa-db-fra.com

Webpack - Échec du chargement du bloc 0

Certains de mes utilisateurs obtiennent cette erreur:

Message de rejet non géré: pile "Échec du chargement du bloc 0": Échec du chargement du bloc 0 sur HTMLScriptElement.n

Le problème est que je n'ai pas réussi à le reproduire. et j'ai cette erreur depuis un certain temps maintenant.

Cela se produit pour les mêmes utilisateurs, chaque fois qu'ils accèdent au site Web. mais seulement pour certains d'entre eux. Pourtant, tous utilisent Win7 + Chrome 60, donc ce n'est pas lié au navigateur.

Je n'ai rien trouvé sur le web concernant cette erreur spécifique. De plus, je n'utilise pas react-router, j'utilise react.

Des idées quoi d'autre pourrait être faux?

Cela pourrait-il être causé par quelque chose lié à une certaine sécurité?

J'utilise webpack 2.6.1 et CommonsChunkPlugin pour créer des blocs pour mes fournisseurs.

L'agent utilisateur de l'un des utilisateurs obtenant l'erreur:

Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, comme Gecko) Chrome/60.0.3112.113 Safari/537.36

javascriptreactjswebpackecmascript-6
12
jony89

La raison en est que j'ai utilisé require.ensure avec webpack qui crée des morceaux et en utilisant jsonp pour ajouter ce script à la demande, en d'autres termes, il ajoute la balise src de script au html avec le fichier de morceau créé.

Il semble que certains utilisateurs ont des extensions ou même une configuration pour bloquer ces requêtes jsonp, que ce soit le même domaine ou non.

Une solution n'utilise pas require.ensure du tout évidemment, ou en utilisant le rappel d'erreur pour gérer ce scénario.

De plus, je cherchais un moyen pour webpack de charger le script en utilisant xhr + eval, ce qui évitera de tels scénarios. Je viens de trouver ce module npm: https://github.com/elliottsj/xhr-eval-chunk-webpack-plugin , mais je m'attendais à ce qu'il soit davantage pris en charge par le webpack lui-même.

J'ai ouvert un problème pour cela: https://github.com/webpack/webpack/issues/56 , j'espère voir des progrès.

3
jony89

Réponse pour la recherche de google:

Dans mon cas Error: Loading chunk 9 failed. tiré uniquement dans Firefox. Causé par une expression rationnelle positive. (?<=...)

Notez que cette fonctionnalité n'est pas encore prise en charge sur tous les navigateurs; utilisez à votre discrétion!

1
Альбэр Местовый

Le problème peut être causé par:

  • Connexion Internet instable
  • Cache de navigateur incorrect/mal formé

La seule solution que j'ai trouvée est de réessayer la charge de bloc avec ce plugin Webpack: https://github.com/mattlewis92/webpack-retry-chunk-load-plugin

Ce sera:

  • Réessayez de charger le morceau une fois par seconde.
  • Ajouterai ?cache-bust=X requête pour éviter (probablement mal formé) le fichier JS mis en cache.

L'inconvénient est - il se retient indéfiniment.

0
Vasyl Boroviak

Vérifiez simplement le chemin qui va charger votre fichier de morceaux (fichiers js). Vérifiez le chemin de deployURL dans le fichier angular.json.

"build": {
    "builder": "@angular-devkit/build-angular:browser",
    "options": {
      "outputPath": "./Scripts/app",
      "deployUrl": "./Scripts/app/",
      "index": "app/index.html",
      "main": "app/main.ts",
      "polyfills": "app/polyfills.ts",
      "tsConfig": "tsconfig.app.json",
      "aot": false,
      "assets": [
        "app/favicon.ico",
        "app/assets"
      ],
0
swapnil Bhoir