twitter bootstrap 3 - link - ¿Para qué se usan los archivos.map en Bootstrap 3.x?

framework de bootstrap

Question

Hay dos archivos incluidos en la carpeta CSS con extensiones de archivo .map. Son:

bootstrap-theme.css.map
bootstrap.css.map

Parecen ser archivos minificados pero no sé para qué sirven.

Answer 1

¿Alguna vez te has encontrado deseando poder mantener tu código del lado del cliente legible y, lo que es más importante, depurable incluso después de haberlo combinado y minimizado, sin afectar el rendimiento? Pues ahora puedes hacerlo a través de la magia de los mapas fuente.

Este artículo explica los mapas de origen con un enfoque práctico.

Answer 2

De trabajar con preprocesadores de CSS en Chrome DevTools :

Muchos desarrolladores generan hojas de estilo CSS utilizando un preprocesador CSS, como Sass, Less o Stylus. Debido a que los archivos CSS se generan, editar los archivos CSS directamente no es tan útil.

Para los preprocesadores que admiten mapas de origen CSS, DevTools le permite editar en vivo los archivos de origen del preprocesador en el panel Orígenes y ver los resultados sin tener que abandonar DevTools o actualizar la página. Cuando inspecciona un elemento cuyos estilos son proporcionados por un archivo CSS generado, el panel Elementos muestra un enlace al archivo fuente original, no al archivo .css generado.

Answer 3

El bootstrap css puede ser generado por Less. El propósito principal del archivo de mapa se utiliza para vincular el código fuente de css a menos código fuente en la herramienta chrome dev. Como solíamos hacer. Si inspeccionamos el elemento en la herramienta chrome dev. Puedes ver el código fuente de css. Pero si incluye el archivo de mapa en la página con el archivo css bootstrap. Puede ver el código menos que se aplica al estilo del elemento que desea inspeccionar.

Answer 4

Estos son mapas de origen. Proporcionar estos junto con archivos fuente comprimidos; Las herramientas de desarrollador como las de Firefox y Chrome las usarán para permitir la depuración como si el código no estuviera comprimido.

Answer 5

Para cualquier persona que haya venido aquí en busca de estos archivos (como yo), generalmente puede encontrarlos agregando .map al final de la URL:

https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css.map

Asegúrese de reemplazar la versión con cualquier versión de Bootstrap que esté usando.

Answer 6

Si se pregunta por qué le faltan los archivos de mapas con Bootstrap 3.x; Asegúrate de tener instalada la versión correcta. Tuve que cargar 3.3.7 para obtener el efecto deseado que estaba buscando.

Answer 7

Si solo desea deshacerse del error, también puede eliminar esta línea en bootstrap.css :

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