# 웹팩
WebPack 개요
이야기하기 전에 먼저 이것이 제 첫 게시글임에 굉장히 설렙니다. 항상 공부하며 막히는 것이 있을 때 다른 누군가의 블로그를 많이 참고했는데 이제 저도 블로그를 써보네요. 공부하며 틈틈히 기록할수있도록 하겠습니다.번들러는 기본적으로 여러 모듈들을 하나의 파일로 묶어주는
웹팩 설정하기
여러개의 나누어져 있는 자바스크립트 파일들을 하나의 파일로 만들어주는 라이브러리자바스크립트 코드들을 압축하고 최적화 할 수 있기 때문에 로딩 속도를 높일 수 있다.webpack.config.js 파일 생성 및 작성entry : 웹팩이 빌드할 파일을 알려주는 역할outp
Webpack 코드 스플리팅 사용 안하는 방법 (splitChunks)
아래 내용은 Vue.config.js에 웹팩 설정을 적용한 내용이지만,단순히 웹팩 기능을 사용하지 않는 코드라서 다른 환경에도 적용이 가능할 것 같습니다.또는
'프론트엔드 개발환경의 이해'를 읽고
유튜브 양재동 코드랩에서 우연히 '프론트엔드 개발환경의 이해'라는 영상을 보다가 찾아보았다. 김정환님의 블로그에 잘 정리되어 있어서 읽어보았는데 그동안 매번 쓰면서 뭔가 했던 내용들을 깔끔하게 정리해주었다.연재는 총 5편으로 진행된다.NPMnode.js의 설치부터 pa
[React] Start to React
> What is React? **"사용자 인터페이스를 만들기 위한 JavaScript 라이브러리" ** 공부를 하다보면 리액트를 라이브러리로 봐야하는가 프레임워크를 봐야하는지의 논의가 자주 등장한다. 나의 생각을 말
.png?w=768)
TIL 69 | Webpack Basics
리액트를 공부하면서 항상 CRA를 사용해서 초기 개발 환경을 구축했는데, 다음주부터 나가는 기업협업에서는 웹팩을 사용한다는 이야기를 선배 기수에게 들었다. 미리 웹팩을 훑고 가면 좋다는 조언을 듣고, 여러 블로그와 유튜브를 찾아보며 웹팩을 이해해보고 있다!
TIL DAY.31 [Vue.js] 웹팩 사용하기
https://media.vlpt.us/post-images/katanazero86/aba9c930-4af7-11ea-b431-d56bc1d096a4/vuejs-tutorial2d2a853c-aa2f-44b0-80df-933b495f77f8.png벌써 개발자로
플러그인, 완성도를 높이다
지난 포스팅에서 `rollup.js` 를 이용해 두 개의 자바스크립트 파일을 하나로 묶고, `rollup.config.js` 파일을 구성해서 CLI가 아닌 스크립트로 설정 파일을 관리하는 것 까지 진행했습니다. 이번 시간에는 `rollup` 에 날개를 달아줄 플러그
번들링, 파일을 하나로 합쳐보자
rollup.js는 자바스크립트 번들러입니다. webpack이나 parcel이랑 비슷하다고 생각하시면 됩니다. 다수의 파일들을 하나의 파일로 묶어서 성능이나 재사용성 부분에서 이득을 가져올 수 있는거죠.타 번들러와의 차별점이라면 CommonJS 방식을 사용하지 않고 표
[Bundlers] 2. Webpack 이란?
의존 관계에 있는 모듈들을 하나의 자바스크립트 파일로 번들링 하는 모듈 번들러별도의 모듈 로더가 필요없어짐하나의 파일로 번들링함으로 다수의 스크립트 파일을 로드할 필요 없어짐Webpack으로 파일 번들링 전에 babel 을 이용해서 ES6+ 코드를 ES5코드로 트랜스파
프론트엔드 개발환경의 이해 (웹팩)
package.json의 "main": "index.js"는 node 서버 개발 환경에서 사용하는 것이므로 무시해도 된다."react": "^16.13.1"유의적 버전(Sementic Version)이다. 버전 번호를 관리하기 위한 규칙 체계주 버전 / 부 버전 / 수
webpack 기초개념 & 기본 설정
Reference : webpack.docswebpack은 모든 file을 module로 간주하며project에 필요한 모든 모듈을 dependency graph에 따라 번들링하는 도구이다.번들링된 결과물을 bundle이라 한다.EntryOutputLoadersPlug
React #06 웹팩 설정
참고웹 개발은 JS 비중이 매우 크다. 따라서 페이지 로딩시 많은 스크립트를 로드할 경우 http 병목현상이 생길 수 있다.웹 팩은 많은 JS파일을 하나의 Bundle파일로 만들어서 이런 현상을 없애기 위함이다.그러나, 모든 파일을 하나로 합치면서 파일의 크기가 커진다
React webpack사용하기 (Babel, webpack-dev-server)
React webpack 설치 방법 (Babel, webpack-dev-server)
