Что такое Source Map

Source Map — это файл, который связывает минифицированный или транспилированный код с исходным, помогая разработчикам отлаживать код в браузере. Он содержит информацию о соответствии строк, переменных и функций между исходным и сжатым кодом.

Пример настройки в Webpack:

module.exports = {
  devtool: 'source-map', // Генерирует .map файл
  // ...
};

Особенности:

• Используется только в development-режиме (не включается в production)
• Поддерживает разные форматы (inline, external, eval)
• Работает с TypeScript, Babel, SASS/LESS

Пример структуры Source Map:

{
  "version": 3,
  "sources": ["original.js"],
  "names": ["myFunction"],
  "mappings": "AAAA,GAAG,CAAC..."
}