D.evelop/Bundler2 [Webpack] 웹팩이란? Webpack 여러개의 리소스 파일을 하나의 파일로 묶어주는 도구(bundler) 중 하나로 최신 JavaScript 애플리케이션을 위한 정적 모듈 번들러 하나의 시작점(entry point)에 의존되는 모듈을 전부 찾아 하나의 결과물로 만들어 냄. 장점 네트워크 접속의 부담을 줄여 더욱 빠른 서비스를 제공할 수 있음 서로 다른 패키지들 간의 동일한 변수명으로 인한 충돌 문제를 줄여줌 리팩토링 효과를 냄 : 구동되는 방식은 그대로 유지하며, 내부의 코드를 효율적으로 바꿈 다양한 플러그인을 제공하고 다양한 작업을 자동화 할 수 있음 구형 브라우저에서 사용 가능하게 함 (IE를 포함한 구형 브라우저에서는 module을 사용할 수 없었음) 핵심 개념 Entry Output Loaders Plugins Mode.. 2021. 12. 15. [Bundler] 번들링Bundling이란? 등장 배경, 종류 Module 분리된 코드 조각 시스템을 이루는 논리적인 일부분 Bundling '묶는다'는 뜻. 기능별로 모듈화 했던 파일들을 하나로 묶어주는 작업을 말한다. Bundler 여러 개의 파일을 묶어주는 도구. Webpack, Borserify, Parcel 등이 있음 배경 // hello.js var word = 'Hello'; // world.js var word = 'World'; 위와 같이 두 js 파일에서 동일한 word라는 변수명을 사용했을 때, 두 변수가 충돌하고 마지막으로 호출한 js파일 선언된 word만 적용된다. 이때 word는 전역 변수. 전역 스코프를 오염 예측하기 어려워짐 코드의 규모가 점점 커지고, 협업의 규모가 커지게 되면 이런 상황은 심각한 문제가 된다. 이러한 문제에 대응하기 .. 2021. 12. 13. 이전 1 다음
