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.

twitter-bootstrap twitter-bootstrap-3 dhblah
la source
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
Possibilité de dupliquer à quoi servent les fichiers .map dans Bootstrap 3.1?
oliver-clare

Réponses:

162

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

utilisateur2779632
la source
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 :

Dominic Zukiewicz
la source
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
27

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

Si l'erreur persiste, nettoyez le cache du navigateur (CTRL + F5).

Nicolás Jofré
la source
2
Même réponse deux ans plus tard?
Panu Haaramo le
Quel est l'intérêt de donner la même réponse que quelqu'un d'autre a déjà donnée il y a des années? stackoverflow.com/a/23909455/1879699
Andreas
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\*"

Avinash Kancharla
la source
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.

Shovalt
la source
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.

Julian Mann
la source
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

Sergio Perez
la source
1

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

Saineshwar
la source
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.

SVANSKI
la source
1

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

fw0213
la source
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à.

Steve
la source
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/">

Sachin de Pune
la source
0

Supprimez la dernière ligne dans bootstrap.css

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

user1498608
la source
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