Каковы.файлы карт, используемые в Bootstrap 3.x?

есть два файла, включенных в CSS папка с .расширения файлов карт. Они:

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

они кажутся уменьшенными файлами, но я не знаю, для чего они предназначены.

7 ответов


с работа с препроцессорами CSS в Chrome DevTools:

многие разработчики создают таблицы стилей CSS с помощью препроцессора CSS, например Sass, Less или Stylus. Поскольку файлы CSS генерируются, редактирование файлов CSS напрямую не так полезно.

для препроцессоров, поддерживающих исходные карты CSS, DevTools позволяет редактировать исходные файлы препроцессора на панели "источники" и просматривать результаты без необходимости покидать DevTools или обновить страницу. При проверке элемента, стили которого предоставлены созданным CSS-файлом, на панели элементы отображается ссылка на исходный исходный файл, а не на созданный .файл CSS.


Если вы просто хотите избавиться от ошибок, вы также можете удалить эту строку в bootstrap.css:

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

Это исходные карты. Предоставьте их вместе со сжатыми исходными файлами; инструменты разработчика, такие как Firefox и Chrome, будут использовать их для отладки, как если бы код не был сжат.


загрузочный css может быть сгенерирован меньше. Основная цель файла карты используется для связи исходного кода css с меньшим исходным кодом в инструменте Chrome dev. Как раньше .Если мы проверим элемент в инструменте Chrome dev. вы можете увидеть исходный код css. Но если включить файл карты на страницу с файлом css bootstrap. вы можете увидеть меньше кода, который применяется к стилю элемента, который вы хотите проверить.


вы когда-нибудь хотели, чтобы ваш клиентский код был читаемым и, что более важно, отлаживаемым даже после его объединения и минимизации, не влияя на производительность? Ну теперь вы можете через магию исходных карт.

в этой статье объясняет исходные карты, используя практический подход.


для тех, кто пришел сюда в поисках этих файлов (Как я), вы обычно можете найти их путем добавления .map до конца URL:

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

обязательно замените версию на любую версию Bootstrap, которую вы используете.


Если вам интересно, почему вам не хватает файлов карт с Bootstrap 3.х; убедитесь, что у вас установлена правильная версия. Мне пришлось загрузить 3.3.7, чтобы получить желаемый эффект, который я искал.