à quoi servent les fichiers .map dans Bootstrap 3.x?
Il existe deux fichiers dans le dossier CSS avec les extensions de fichier .map. Elles sont:
bootstrap-theme.css.map
bootstrap.css.map
Ils semblent être des fichiers minifiés mais je ne sais pas à quoi ils servent.
Depuis Utilisation des pré-processeurs CSS dans Chrome DevTools :
De nombreux développeurs génèrent des feuilles de style CSS à l'aide d'un préprocesseur CSS, tel que Sass, Less ou Stylus. Étant donné que les fichiers CSS sont générés, la modification directe des fichiers CSS n’est pas aussi utile.
Pour les préprocesseurs prenant en charge les mappes de sources CSS, DevTools vous permet de modifier en direct vos fichiers source de préprocesseur dans le panneau Sources et d'afficher les résultats sans avoir à quitter DevTools ou à actualiser la page. Lorsque vous inspectez un élément dont les styles sont fournis par un fichier CSS généré, le panneau Eléments affiche un lien vers le fichier source d'origine, pas vers le fichier .css généré.
Si vous voulez juste vous débarrasser de l'erreur, vous pouvez aussi supprimer cette ligne dans bootstrap.css:
/*# sourceMappingURL=bootstrap.css.map */
Ce sont des cartes sources. Fournissez-les à côté des fichiers sources compressés; des outils de développement tels que ceux de Firefox et de Chrome les utiliseront pour permettre le débogage comme si le code n'était pas compressé.
Le css bootstrap peut être généré par Less. L'objectif principal du fichier map est utilisé pour lier le code source css à moins de code source dans l'outil de développement chromé. vous pouvez voir le code source de css . Mais si inclure le fichier map dans la page avec le fichier bootstrap css vous pouvez voir le moins de code qui s'applique au style d'élément que vous souhaitez inspecter.
Vous est-il déjà arrivé de souhaiter garder votre code client lisible et, plus important encore, débogable, même après l'avoir combiné et réduit au minimum, sans affecter les performances? Eh bien maintenant, vous pouvez utiliser la magie des cartes source.
Cet article explique Source Maps en utilisant une approche pratique.
Pour tous ceux qui sont venus chercher ces fichiers (comme moi), vous pouvez généralement les trouver en ajoutant .map à la fin de l'URL:
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css.map
Assurez-vous de remplacer la version par la version de Bootstrap que vous utilisez.
Si vous vous demandez pourquoi les fichiers de carte avec Bootstrap 3.x sont manquants; assurez-vous d'avoir la bonne version installée. J'ai dû charger 3.3.7 pour obtenir l'effet désiré.
Qu'est-ce qu'un fichier de carte CSS?
Il s’agit d’un fichier au format JSON qui relie le fichier CSS à ses fichiers sources. Normalement, les fichiers écrits en préprocesseurs Less, Saas, Sylus…, afin de procéder à un débogage direct des fichiers sources à partir du navigateur Web.
Qu'est-ce que le préprocesseur CSS? Exemples: Saas, Less, Stylus
C'est un outil générateur de CSS qui utilise le pouvoir de programmation pour générer du CSS de manière robuste et rapide.