엔트리 포인트

엔트리 포인트 (Entry Points)

엔트리 포인트는 webpack에게 의존성 그래프를 어디서부터 그리기 시작할지를 알려주는 지점이에요. 이 파일에서 출발해 webpack이 import한 모든 모듈과 자산을 재귀적으로 따라가며, 최종 번들에 무엇이 포함되어야 하는지를 결정해요. 이 결과는 output 설정에 따라 디스크에 파일로 쓰여요.

출처: Webpack — Entry Points

기본값과 단일 엔트리

설정 파일 없이 webpack을 실행하면 엔트리 기본값은 './src/index.js'예요. 이 파일이 없으면 webpack은 ERROR in Entry module not found: Error: Can't resolve './src' 같은 오류를 던져요. 디렉토리를 먼저 해석한 뒤 그 안에서 index.js를 찾다 실패하기 때문에 메시지가 './src/index.js'가 아니라 './src'를 가리키는 거예요.

단일 엔트리를 지정할 때는 문자열 하나만 주면 돼요.

// webpack.config.js
export default {
  entry: "./path/to/my/entry/file.js",
}

이 단일 엔트리 문법은 아래처럼 객체로 쓰는 것과 같아요.

export default {
  entry: {
    main: "./path/to/my/entry/file.js",
  },
}

여러 엔트리

entry에 파일 경로 배열을 넘기면 "multi-main entry"를 만들 수 있어요. 여러 의존 파일을 함께 주입해서 하나의 청크로 묶고 싶을 때 유용해요.

export default {
  entry: ["./src/file_1.js", "./src/file_2.js"],
}

엔트리가 둘 이상이면 각 엔트리마다 청크가 생기므로, output.filename에 [name] 같은 치환을 써서 파일마다 고유한 이름을 붙여 줘야 해요.

엔트리 포인트