bootstrap min css map

Узнайте, что включено в Bootstrap, включая наши перекомпилированные данные и исходные коды. Помните, что для плагинов JavaScript Bootstrap’у требуется jQuery.

Предварительно компилированный Bootstrap

Строение скачанного архива BS4 будет таким:

Это базовая форма Bootstrap: перекомпилированные файлы для быстрого подключения в почти любой веб-проект. Доступны: компилированные файлы CSS и JS ( bootstrap.* ), как и компилированные «облегченные» файлы ( bootstrap.min.* ). Карты исходного кода CSS ( bootstrap.*.map ) доступны для использования лишь с определенными инструментами разработчика в браузере. Связанные JS-файлы ( bootstrap.bundle.js и минимизированный bootstrap.bundle.min.js ) включают Popper, но не jQuery.

Кодовые карты дают независимый от языка способ показа соответствия рабочего кода и исходных кодов (sources), написанных вами при разработке.

Файлы СSS

Bootstrap включает несколько параметров для подключения всех ваших компилированных CSS.

CSS файлы Разметка Содержание Компоненты Утилиты
Включены Включены Включены Включены
Только Система сеток Не включены Не включены Только flex утилиты
Не включены Только Reboot Не включены Не включены

Файлы JS

Аналогично имеются параметры для подключения всех или некоторых компилированных файлов JavaScript.

JS-файлы Popper jQuery
Включены Не включены
Не включены Не включены

Исходный код Bootstrap

Загрузка исходного кода Bootstrap включает, наряду с исходниками Sass, CSS и JS, перекомпилированные механизмы публикации ресурсов CSS и JS.

Механизм публикации ресурсов (asset) полезен в следующих случаях:

  • При оформлении кода как расширения, ресурсы которого содержатся в той же папке, что и код.
  • При использовании ресурсов за корнем веб-сервера.
  • Для обработки ресурсов непосредственно перед публикацией. Например, сжатия CSS и JavaScript.
  • При использовании одного и того же ресурса множеством компонент (для исключения дубликатов).

Если быть более точным, сюда входит следующее:

В папках scss/ и js/ лежат исходники нашего CSS и JS. Папка dist/ содержит всё перечисленное в параграфе Precompiled Bootstrap выше. Папка docs/ лежит исходный код документации, и содержит папку examples/ — примеры использования Bootstrap. Помимо этого, любой другой подключенный файл нужен для поддержки пакетов, содержит информацию о лицензии и разработке.

There are two files included in the CSS folder with .map file extensions. They are:

They appear to be minified files but I don’t know what they are for.

8 Answers 8

Many developers generate CSS style sheets using a CSS preprocessor, such as Sass, Less, or Stylus. Because the CSS files are generated, editing the CSS files directly is not as helpful.

For preprocessors that support CSS source maps, DevTools lets you live-edit your preprocessor source files in the Sources panel, and view the results without having to leave DevTools or refresh the page. When you inspect an element whose styles are provided by a generated CSS file, the Elements panel displays a link to the original source file, not the generated .css file.

If you just want to get rid of the error, you can also delete this line in bootstrap.css :

These are source maps. Provide these alongside compressed source files; developer tools such as those in Firefox and Chrome will use them to allow debugging as if the code was not compressed.

The bootstrap css can be generated by Less. The main purpose of map file is used to link the css source code to less source code in the chrome dev tool. As we used to do .If we inspect the element in the chrome dev tool. you can see the source code of css. But if include the map file in the page with bootstrap css file. you can see the less code which apply to the element style you want to inspect.

Have you ever found yourself wishing you could keep your client-side code readable and more importantly debuggable even after you’ve combined and minified it, without impacting performance? Well now you can through the magic of source maps.

This article explains Source Maps using a practical approach.

For anyone who came here looking for these files (Like me), you can usually find them by adding .map to the end of the URL:

Be sure to replace the version with whatever version of Bootstrap you’re using.

What is a CSS map file?

It is a JSON format file that links the CSS file to its source files, normally, files written in Less, Saas, Sylus…etc preprosessors, this is in order do a live debug to the source files from the web browser.

What is CSS preprocessor? Examples: Saas, Less, Stylus

It is a CSS generator tool that uses programming power to generate CSS robustly and quickly.

If you are wondering why you are missing the map files with Bootstrap 3.x; make sure you have the correct version installed. I had to load 3.3.7 to get the desired effect I was looking for.

Not the answer you’re looking for? Browse other questions tagged twitter-bootstrap-3 source-maps or ask your own question.

Linked

Hot Network Questions

To subscribe to this RSS feed, copy and paste this URL into your RSS reader.

site design / logo © 2019 Stack Exchange Inc; user contributions licensed under cc by-sa 4.0 with attribution required. rev 2019.11.15.35459

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

Bootstrap может иметь одну из двух форм, как прекомпилированный или исходный код. Узнайте больше о содержании и структуре каждой формы ниже. Помните, что вне зависимости от формы реализации, Bootstrap-овские плагины JavaScript требуют jQuery.

Прекомпилированный Bootstrap

После загрузки разархивируйте сжатую папку, и вы увидите что-то вроде этого:

Это самая базовая форма Bootstrap: предварительно скомпилированные файлы для быстрого использования в почти любом веб-проекте. Мы предоставляем скомпилированные CSS и JS ( bootstrap.* ), а также скомпилированные и уменьшенные CSS и JS ( bootstrap.min.* ). CSS исходные карты ( bootstrap.*.map ) доступны для использования с инструментами разработчика некоторых браузеров.

Исходный код Bootstrap

Загрузка исходного кода Bootstrap включает в себя прекомпилированный CSS и JavaScript, а также исходные файлы Sass, JavaScript и документацию. Более конкретно, он включает следующее и более:

scss/ и js/ являются исходным кодом для наших CSS и JavaScript. В папке dist/ содержится все, указанное в предкомпилированом разделе загрузки. В папке docs/ содержится исходный код нашей документации и examples/ использования Bootstrap. Кроме того, любой другой включенный файл поддерживает пакеты, информацию о лицензии и разработку.

Оцените статью