인프런 커뮤니티 질문&답변

네... 교과서 레벨의 답변을 주셧네요 많은도움 감사합니다!

저 지난번 스노우팩 + 타입스크립트 + 바밸 적용 해결했어요!! babel.config.json 추가 하면 되는 간단한 것을 너무나 길게 해맸네요 ㅎㅎ 노드 공부도 필요한것같습니다 ㅎㅎ

이제 마무리하고 다음 무비강의에서 뵙겠습니다^^

Snowpack은 빌드 도구이고 Svelte 컴파일은 @snowpack/plugin-svelte 같은 플러그인이 담당합니다.
알고 계신 Snowpack의 _dist_ 디렉터리에는 번들이 아니고 브라우저에서 동작할 빌드 결과가 들어갑니다.

조금 더 쉽게 정리하자면,
Rollup의 build 디렉터리는 번들(묶음 처리)된 빌드 결과가 들어가고,
Snowpack의 _dist_ 디렉터리는 번들 없는(일부는 번들일 수도 있는) 빌드 결과가 들어갑니다.

Snowpack의 특징인 빠른 개발 빌드가 여기에서 설명이 됩니다.
개발할 때 프로젝트를 수정하면, 수정된 결과에 맞게 브라우저에서 동작시킬 결과를 만들어야 하는데요(그것이 빌드), 번들(묶음 처리)을 하게 되면 한 글자만 수정하더라도 번들 전체를 다시 만들어야 하죠.
그런데 Snowpack은 번들(묶음 처리)이 아닌 따로따로 결과를 만들기 때문에 한 글자를 수정했다면, 그 수정된 파일(모듈)만 다시 만들면 됩니다.
따라서 프로젝트 규모가 커질 수록 속도 차이가 아주 크게 발생합니다.
그리고 이런 방식이 가능해진 것이 웹 브라우저에서 모듈 사용을 지원하기 시작하면서입니다.

Snowpack을 사용한다는 것은 내 프로젝트를 웹 브라우저에서 모듈 방식으로 동작시키는 것이고(그렇게 동작할 수 있도록 정리해 주는 것이 Snowpack이고요), 그 방식에 필요한 일부 모듈을 만들 때 번들이 필요할 수도 있는데 그때 Rollup 같은 번들러를 사용한다는 거죠.

빠르게 정리하느라 조금 거칠게 표현한 부분이 많은데요.
대략적인 내용은 이해되실 거로 생각합니다.
관련해 'JS 번들 개발이란'으로 검색해 보시면 좋은 정보가 많이 있네요~😉

답글 감사합니다 설인데 남겨주셨네요^^ 고맙습니다

다른것이 아니라, 제가 번들링 개념이 잘 안잡혀있어서 이해가 어려웠나봅니다.

하나만 더 여쭤봐도 될까요? 스노우 팩은 컴파일러 이면서도 여러 플러그인을 통해 _dist_ 에 번들링이 되고 있던건 맞는거죠?

롤업도 build폴더에 결과가 저장되는데, 이부분이 비슷해서 동일시하다보니 생긴 궁금증 이었어요

속도면에서 스노우팩이 월등하기도 하고, 하지만 결정적인 차이가 어느부분인지 아직감이 잘 안오네요 ㅎㅎ

혹시 이런 부분에 도움을 받을수 있는 자료가 있을까요?

우선 Snowpack은 번들러가 아니고 빌드 도구입니다.
Snowpack 기본 원리(번들 없는 개발, Unbundled Development)로 봐선 마치 번들이 필요치 않을 것 같지만,
프로젝트에선 상황에 따라 언제든지 파일 번들이 필요할 수도 있고,
그때 Rollup이나 Webpack을 통해 그 작업(번들)을 수행한다는 것이죠.
번들 중심 개발(Bundled Development)은 아니지만, 번들은 충분히 필요할 수 있다고 정리할 수 있습니다.

그리고 이 도구들은 브라우저에서 동작하는 것이 아니기 때문에,
원하는 결과만 만들 수 있다면 어떻게 사용하든 상관없으니 굳이 분리해서 생각할 필요가 없을 듯합니다.

결국, 이런 내용 때문에 '생산성 향상'이라 표현한 것 같습니다.
제 의견이 생각을 정리하시는 데 도움이 되실까요?

그럼 Truestar 님도 새해 복 많이 받으시고요,😆
즐거운 설 명절 보내세요~👍
감사합니다.