webpack 2

[typescript] ts-loader와 babel-loader

기존에 프로젝트를 세팅할 때 loader에 관해서는 크게 고민하지 않고 여러 블로그를 보며 셋팅을 했다. 이유를 크게 생각하지 않고 babel-loader와 ts-loader를 모두 넣어두었다. 좋은 계기로 엄청난 에러를 발견했고, 두 로더의 차이와 프로젝트에 어떤 적용을 했는지 자세히 적어보려고 한다. 에러 발견 children으로 배열을 스프레드 해놓은 엄청난 문법에러를 저질러놓았다. 하지만 기존의 설정으로는 빌드시에 이를 발견하지 못하고, 동작시에도 문제를 발견하지 못했다. 로더에 변화를 주기 전까지는 놀랍게도 이 에러를 발견하지 못했다. babel-loader와 ts-loader의 차이를 알아보기 위해 하나씩만 적용해 보았을 때야 이러한 문제를 찾을 수 있었다. babel-loader에서는 이러한..

Typescript 2022.09.25

웹팩(webpack) 알러지 치료하기 - 1

create-react-app 없이 react를 설정할 수 있는 그날까지....! 배경 왜 webpack을 사용하기 시작했는지를 알아보자. 웹팩의 깃헙에서 웹팩을 아래와 같이 소개하고 있다. webpack is a bundler for modules. The main purpose is to bundle JavaScript files for usage in a browser, yet it is also capable of transforming, bundling, or packaging just about any resource or asset. 웹팩은 모듈(module)을 위한 번들러(bundler)이다. 그렇다면 모듈과 번들러에 대해 알아보자. 모듈(module) 모듈(module)은 재사용 가능한 ..

JavaScript 2022.02.27
반응형