Sofia Emelianova
소스 맵을 사용하면 코드를 결합하고 축소한 후에도 성능에 영향을 미치지 않으면서 코드를 읽고 디버그할 수 있도록 유지할 수 있습니다.
다양한 트랜스파일러, 축소기 및 번들러를 사용할 때 배포하는 코드는 작성하는 코드와 다릅니다. 이러한 도구는 네트워크 성능을 개선하기 위해 코드를 한 줄로 압축하고, 불필요한 문자를 삭제하고, 변수를 단축합니다.
많은 도구를 사용하여 코드와 함께 제공되는 소스 맵을 생성할 수 있습니다.
Chrome DevTools는 배포된 코드와 소스 맵을 모두 읽으며, 중단점이 있는 경우에도 평소와 같이 코드를 디버그할 수 있습니다.
소스 맵의 작동 방식을 더 잘 이해하려면 소스 맵 비주얼라이저를 확인하세요.
또한 소스 맵에는 확장 프로그램이 있을 수 있습니다. 도구와 프레임워크를 빌드한다면 지원을 고려해 보세요. 우수사례: DevTools로 Angular 디버깅 개선을 확인하세요. 여기에서 DevTools팀과 Angular는 x_google_ignoreList 확장 프로그램을 지원하여 DevTools의 디버깅 환경을 개선했습니다.
자세한 내용은 다음을 참고하세요.