아웃풋 Outputoutput 설정은 웹팩이 어떻게 컴파일 된 파일을 디스크에 생성할지 표현한다. entry point는 여러개 존재할 수 있지만, output은 오직 하나만 지정될 수 있다. 사용법웹팩 구성에서 output 프로퍼티의 최소 요구사항은 filename 을 지정하는 것이다. webpack.config.jsmodule.exports = { output: { filename: 'bundle.js', } }; 위와 같은 구성은 dist 폴더에 하나의 bundle.js 파일을 생성한다. 여러개의 엔트리 포인트 Multiple Entry Points만약 여러개의 엔트리 포인트를 구성하거나 CommonsChunkPlugin 같은 플러그인을 사용해서 여러개의 chunk 를 만들고 싶다면, 각 파일들이 ..
개념모던 자바스크립트 어플리케이션을 위한 스태틱 모듈 번들러 (static module bundler for modern JavaScript applications) 프로젝트에서 필요한 모든 모듈을 의존성 그래프를 만들어 매핑 -> 하나, 혹은 그 이상의 번들 생성 핵심 개념엔트리 Entry아웃풋 Output로더 Loaders플러그인 Plugins 엔트리 Entryentry point : 어떤 모듈을 사용해서 시작할지 디폴트는 ./src/index.js 이지만 수정하거나 여러개의 엔트리 포인트를 설정할 수 있다. webpack.config.jsmodule.exports = { entry: './path/to/my/entry/file.js' }; 아웃풋 Output만들어진 번들을 어떤 파일명으로, 어느 폴..
이전 강좌의 코드를 활용합니다. 지금까지 우리는 모든 에셋을 수동으로 index.html 에 포함시켰습니다. 하지만 어플리케이션이 커지면서 파일이름에 해시를 사용하고 여러 번들을 출력하기 시작하면, index.html 파일을 수동으로 관리하는것은 어려워 질 것입니다. 이 프로세스를 훨씬 더 쉽게 관리해주는 몇몇 플러그인이 존재하니, 알아봅시다. 준비 Preparation먼저 프로젝트를 약간 수정해 봅시다. project webpack-demo |- package.json |- webpack.config.js |- /dist |- /src |- index.js + |- print.js |- /node_modules src/print.js 에 몇가지 로직을 추가합니다. src/print.jsexport de..
- Total
- Today
- Yesterday