Bootstrap essayant de charger le fichier de carte. Comment le désactiver? Dois-je le faire?


127

Je joue récemment avec bootsrap3. Je l'ai compilé à partir des sources et inclus les distr js et css dans mon projet. Le truc, c'est que je vois dans les outils de développement GH, qu'il essaie d'obtenir le fichier .map.css. Pourquoi veut-il le faire? Comment le désactiver? Dois-je le désactiver? Pour ne pas avoir de marque d'erreur dans les outils de développement, j'ai ajouté ce fichier de carte, après quoi tous les styles sont affichés tels qu'ils sont définis dans moins de fichiers, ce qui ne m'aide pas beaucoup.


5
L'une des réponses ci-dessous répond-elle à votre question? Sinon, pouvez-vous mettre à jour votre question afin que nous puissions améliorer nos réponses?
Dominic Zukiewicz

Réponses:


162

Supprimer la ligne /*# sourceMappingURL=bootstrap.css.map */debootstrap.css


38
Veuillez expliquer brièvement votre réponse pour rendre votre réponse plus utile à OP et aux autres lecteurs.
Mohit Jain

9
Cela fonctionne, mais si bootstrap est référencé directement à partir de node_modules, lorsque bootstrap est réinstallé, il sera réécrit
Alexander

2
Hou la la! Absolument fou ... cela ne fonctionne que si vous "supprimez" la ligne (comme vous l'avez dit) ... commenter produit encore des erreurs 404! Heureux d'avoir trébuché sur votre message!
flipflopmedia

120

Les fichiers .map permettent à un navigateur de télécharger une version complète du JS minifié. C'est vraiment à des fins de débogage.

En effet, le .map manquant n'est pas un problème. Vous savez seulement qu'il manque, car le navigateur a ouvert ses outils de développement, détecté un fichier minifié et vous informe simplement que le débogage JS ne sera pas aussi bon qu'il pourrait l'être.

C'est pourquoi les bibliothèques comme jQuery ont le fichier complet, le fichier minifié et le fichier de carte aussi.

Consultez cet article pour une explication complète des fichiers .map :


1
Les télécharger? D'où? J'ai supposé que ces fichiers .less sont emballés d'une manière ou d'une autre dans un fichier de carte. Et lors du chargement de la page, bootrap recrée ces fichiers à partir d'un package.
dhblah le

1
Depuis le même répertoire, il obtient le .js. N'oubliez pas que ce n'est que lorsque les outils de développement sont ouverts, pas comme une demande normale.
Dominic Zukiewicz

Merci pour votre réponse, mais je n'ai pas de .lessfichiers dans mon projet. Je n'ai ajouté .cssque des .jsfichiers et ce mapfichier.
dhblah

1
@Raymond: Les outils de développement ne comprennent pas les noms de fichiers comme .min.css - après tout - pouvons-nous garantir qu'il est minifié? Non .. il téléchargera le .map juste pour s'assurer qu'il a les deux copies disponibles. Encore une fois, cela est activé avec les outils de développement. Si vous fermez la fenêtre des outils, elle ne sera pas demandée.
Dominic Zukiewicz

3
Pour réitérer, le fichier .map n'est demandé et utilisé que lorsque les outils de développement sont ouverts, donc s'il est manquant, vous ne recevez aucune demande supplémentaire en échec lorsqu'un utilisateur typique accède à votre page.
tomf


17

Supprimez la ligne "/*# sourceMappingURL=bootstrap.min.css.map */ "dans les fichiers suivants.

  • css / bootstrap.min.css
  • css / bootstrap.css

Pour récupérer le chemin du fichier sous Linux, utilisez la commande find / -name "\*bootstrap\*"


Les fichiers de carte source, tels que bootstrap.min.css.map, sont générés automatiquement pendant le processus de minification / compilation des fichiers. Ils ne sont en fait pas nécessaires pour la production, mais occupent en même temps 3 fois plus d'espace disque que ceux qu'ils mappent. C'est pourquoi nous ne les incluons pas dans la version. Si vous souhaitez simplement supprimer ce message, vous pouvez soit supprimer des commentaires tels que / * # sourceMappingURL = bootstrap.min.css.map * / dans bootstrap.min.css, bootstrap.min.js et popper.min.js, soit télécharger la source map des fichiers d'une version Bootstrap 4.1.3 et placez-les dans le répertoire libs.
Ajay Takur

17

Cela ne se produit que lorsque vous utilisez les outils de développement et ne se produira pas pour les utilisateurs normaux accédant au serveur de production.

Dans tous les cas, j'ai trouvé utile de désactiver simplement ce comportement dans les outils de développement : ouvrez les paramètres et décochez l'option "Activer les cartes source".

Il n'y aura plus de tentative d'accès aux fichiers cartographiques.


Je pense que ce sont peut-être les réponses les plus pertinentes. D'autres ne sont pertinents que si les fichiers mentionnés sont fournis avec votre application - ce qui n'est pas toujours le cas.
Lukino

6

Si vous ne disposez pas du fichier .map correct et que vous ne souhaitez pas modifier les lignes dans bootstrap.css, vous pouvez créer un fichier .map factice.

Dans mon cas, je voyais l'erreur:

GET /bootstrap.css.map not found.

J'ai donc créé un bootstrap.css.map vide dans le répertoire / public et l'erreur s'est arrêtée.


1
Ne fonctionne pas avec bowerou quelque chose comme ça, car en mode production installera le bootstrap à partir de la source. Idem pour toute réponse qui dit de supprimer la ligne /*# sourceMappingURL=bootstrap.css.map */.
monteirobrena

4

Supprimer / * # sourceMappingURL = bootstrap.min.css.map * / dans css / bootstrap.min.css

et supprimez / * # sourceMappingURL = bootstrap.css.map * / dans css / bootstrap.css


1

De bootstrap.css supprimez la dernière ligne / * # sourceMappingURL = bootstrap-theme.css.map * /


1

J'avais également des avertissements dans Google Dev-Tools et j'ai ajouté uniquement le fichier bootstrap.min.css.map dans le même dossier, où se trouve bootstrap.min.css.

Je n'ai maintenant plus d'avertissements et vous pouvez trouver plus d'explications ici: https://github.com/twbs/bootstrap#whats-included

J'espère, j'ai répondu à votre question.


1

Pour moi, j'ai créé un bootstrap.css.map vide avec bootstrap.css et l'erreur s'est arrêtée.


1

La suppression de cette ligne le résout, mais le problème est que les fichiers boostrap sont bower_componentsenregistrés et non archivés dans le contrôle de code source.

Ainsi, chaque développeur de l'équipe obtiendra le fichier css avec la référence de la carte lorsqu'il extraira le dépôt et le fera bower install(ce qui fait partie de l'utilisation d'un nouveau dépôt).

Le fichier ne doit pas avoir la référence à une carte qui n'est pas là.


1

OK Récemment, j'ai rencontré ce problème J'ai une solution très simple pour résoudre ce problème, suivez ces étapes: accédez à ces répertoires src-> app-> index.html ouvrez le index.html et trouvez le <base href="your app name ">changement en<base href="https://stackoverflow.com/">


0

Supprimez la dernière ligne dans bootstrap.css

suivant lin / * # sourceMappingURL = bootstrap.css.map * /


essayez d'expliquer le problème et comment votre réponse obtient une solution, sa bonne pratique qui permet au nouvel utilisateur d'apprendre ce qui s'est passé
Pankaj Nimgade
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.