Co to jest format pliku MAP?
Plik .map to dokument JSON w formacie tekstowym, który łączy zminifikowany lub skompilowany wynik - taki jak spakowany plik .js lub skompilowany arkusz stylów CSS - z powrotem z oryginalnym, czytelnym dla człowieka kodem źródłowym. Narzędzia do budowania, takie jak webpack, Vite, esbuild oraz kompilator TypeScript (tsc), generują pliki .map automatycznie wraz z plikami wynikowymi.
Format został wystandaryzowany jako Source Map Revision 3 około 2011 roku i jest obecnie powszechnie obsługiwany przez wszystkie główne potoki budowania JavaScript i CSS. Mapa źródłowa znajduje się obok pliku, który opisuje - app.js tworzy app.js.map, styles.css tworzy styles.css.map - a zminifikowany plik odwołuje się do niej poprzez komentarz na końcu: //# sourceMappingURL=app.js.map (lub /*# sourceMappingURL=styles.css.map */ dla CSS).
Sercem każdej mapy źródłowej jest pole mappings: kompaktowy ciąg znaków zakodowany w Base64 VLQ, który rejestruje segment po segmencie tłumaczenie z każdej pozycji znaku w pliku wynikowym z powrotem do odpowiedniej linii i kolumny w oryginalnym źródle. Inne pola zawierają ścieżki do plików oryginalnych (sources), opcjonalnie pełny tekst źródłowy (sourcesContent) oraz nazwy symboli (names).
Narzędzia deweloperskie przeglądarek - Chrome DevTools, Firefox Developer Tools i Safari Web Inspector - korzystają z plików .map w sposób przezroczysty. Programiści mogą ustawiać punkty przerwania w TypeScript lub SCSS i przechodzić przez oryginalny kod, mimo że przeglądarka wykonuje zminifikowany wynik. Plik .map jest pobierany tylko wtedy, gdy DevTools są otwarte; nie obciąża on normalnego przeglądania stron.
Bezpieczeństwo
RYZYKO: LOWMapa źródłowa to pasywny plik JSON i nie wykonuje kodu, więc otwarcie go jest bezpieczne. Prawdziwym problemem dla programistów jest kwestia prywatności/bezpieczeństwa: mapy źródłowe wysłane na produkcję mogą ujawnić Twój oryginalny, niezminifikowany kod źródłowy - a czasem także komentarze, ścieżki do plików lub sourcesContent - każdemu, kto otworzy DevTools. Z tego powodu wiele zespołów celowo usuwa lub blokuje pliki .map na publicznych serwerach. Jeśli znajdziesz nieoczekiwane pliki .map na działającej stronie, może to być problem z ujawnieniem informacji, który warto naprawić.
Szczegóły formatu
w pigułce- Dane MapInfo GIS (.map + .tab) - Binarny magazyn geometrii dla tabeli MapInfo; otwierany za pomocą towarzyszącego pliku .tab w QGIS lub MapInfo Pro, nie samodzielnie.
- Mapa poziomu gry - Tekstowa geometria poziomu z edytorów id Tech / Quake / Source / Radiant, kompilowana do poziomu binarnego (np. .bsp) na potrzeby rozgrywki.
- Mapa konsolidatora / debugowania - Tekstowa lista adresów symboli i układu pamięci generowana przez kompilator/konsolidator w celu debugowania awarii.
Programy otwierające pliki MAP
Windows3 apps
Visual Studio Code
Darmowy Otwórz plik .map, aby odczytać JSON. VS Code automatycznie korzysta z map źródłowych podczas debugowania pasującego zminifikowanego JS/CSS. 
Browser DevTools (Chrome / Edge / Firefox)
Wbudowany Załaduj stronę, otwórz DevTools - przeglądarka pobierze plik .map znajdujący się obok zminifikowanego pliku i automatycznie wyświetli oryginalne źródło. To główny sposób „używania” map źródłowych.
Notepad++ (built-in / any text editor)
Open-source Otwórz plik .map jako tekst, aby potwierdzić, że jest to mapa źródłowa (JSON z „"version":3”) i przejrzeć listę źródeł. 
macOS2 apps
Visual Studio Code
Darmowy Otwórz plik .map, aby odczytać JSON. VS Code automatycznie korzysta z map źródłowych podczas debugowania pasującego zminifikowanego JS/CSS.
Browser DevTools (Safari / Chrome / Firefox)
Wbudowany Otwórz DevTools na stronie; przeglądarka automatycznie zastosuje plik .map, aby pokazać oryginalne źródło. 
Linux2 apps
Browser DevTools (Chrome / Firefox)
Wbudowany Otwórz DevTools; mapa zostanie automatycznie pobrana i zastosowana obok zminifikowanego pliku. Szczegóły techniczne
specyfikacja| Typ formatu | Tekstowy JSON (UTF-8); brak binarnych sygnatur (magic bytes) |
| Specyfikacja | Source Map Revision 3 (v3) |
| Typ MIME | application/json |
| Kodowanie mapowań | Base64 VLQ (Variable-Length Quantity) - koduje przesunięcia linii i kolumn dla każdego segmentu wynikowego |
| Wymagane pola JSON | version (musi wynosić 3), sources (tablica ścieżek do plików oryginalnych), mappings (ciąg znaków zakodowany w VLQ) |
| Opcjonalne pola JSON | sourcesContent (osadzony tekst oryginalny), names (lista symboli), sourceRoot (prefiks ścieżki dla wszystkich źródeł) |
| Konwencja nazewnictwa | Nazwa pliku wynikowego z dodanym .map: app.js → app.js.map, styles.css → styles.css.map |
| Komentarz linkujący źródło (JS) | //# sourceMappingURL=filename.js.map - dodawany w ostatniej linii zminifikowanego pliku |
| Komentarz linkujący źródło (CSS) | /*# sourceMappingURL=filename.css.map */ - dodawany do skompilowanego arkusza stylów |
| Typowe generatory | webpack, Vite, esbuild, kompilator TypeScript (tsc), Dart Sass, Rollup, Parcel |
| Używane przez | Narzędzia deweloperskie przeglądarek: Chrome DevTools, Firefox Developer Tools, Safari Web Inspector, Edge DevTools |
| Precyzja mapowania | Poziom kolumny: każdy segment VLQ mapuje pojedynczą kolumnę wynikową na linię i kolumnę źródłową |
| Rozmiar pliku | Zazwyczaj 2-10 razy większy niż zminifikowany wynik; rośnie bardziej, gdy osadzony jest sourcesContent |
| Alternatywa dostarczania przez HTTP | Nagłówek odpowiedzi X-SourceMap (przestarzały; preferowaną metodą jest komentarz wewnątrz pliku) |
| Aktywacja w DevTools | Pobierane tylko wtedy, gdy narzędzia deweloperskie przeglądarki są otwarte; nie jest żądane podczas normalnego ładowania strony |
| Wydano | Source Map format v3 (~2011); ubiquitous with modern JS/CSS build tooling |
| Otwarty standard | Tak · bezpłatny (royalty-free) |
| Specyfikacja | sourcemaps.info |
Konwersje MAP
Pytania i odpowiedzi społeczności
pytania użytkownikówBrak pytań - bądź pierwszą osobą, która zapyta o pliki MAP.
Najczęściej zadawane pytania
Co to jest plik .map?
Co to jest plik .js.map lub .css.map?
Jak otworzyć plik mapy źródłowej (.map)?
Czy pliki map źródłowych (.map) powinny znajdować się na mojej działającej stronie?
Czy mogę odzyskać oryginalny kod z pliku .map?
sourcesContent) pozwala DevTools lub narzędziom typu „unminify” zrekonstruować oryginalne pliki. Dlatego publiczne udostępnianie map jest kwestią prywatności.
