monorepo를 다룰 때 lerna와 webpack을 올바르게 사용하는 방법

Question

React를 사용하여 빌드 된 UI 킷의 모든 단일 구성 요소를 포함하는 monorepo를 구성하고 있습니다.

index.js 
packages/ 
    pack1/ 
    pack2/ 

내가 webpack으로 모든 패키지를 구축하고자하지만, 하나의 webpack.config.js 만 사용할 : 나는 monorepo/멀티 패키지 구성에 경험이 없기 때문에 내가 lerna을 사용하고

는, 지금은이 구조를 가지고 루트 폴더 및 모든 패키지 디렉토리에 pack*.dist.js을 작성하는 단일 명령.

가능합니까? 어떤 방향으로?

Answer 1

질문은 다소 일반적인 것이지만 여기에 시작이 있습니다.

나는 웹팩와 모든 패키지를 빌드하지만 모든 패키지 디렉토리에 팩 *의 .dist.js을 만들 에 루트 폴더 및 단일 명령 만 하나의 webpack.config.js를 사용하려면 싶습니다.

가능합니까? 어떤 방향으로?

예, 가능합니다. webpack.config.js 파일에 pack1과 pack2을 entry으로 나열해야합니다. 아마 모든 일반적인 제 3 자와 사내 종속성을 벤더 번들에 묶어두기를 원할 것입니다. 당신은 "응용 프로그램"에 함께 번들을 짜는 방법

let entries = { 
    pack1: 'path/to/entry/point/pack1', 
    pack2: 'path/to/entry/point/pack2' 
}; 

export default { 
    entry: { ...entries }, 
    module: { 
    rules: [ 
     { 
     // ... usual rule config props 
     include: [ 
      '/path/to/pack1/src-for-rule', 
      '/path/to/pack2/src-for-rule' 
     ] 
     } 
    ] 
    }, 
    plugins: [ 
    new webpack.optimize.CommonsChunkPlugin({ 
     name: 'vendor', 
     chunks: Object.keys(entries), 
     minChunks: (module) => { 
      return /node_modules/.test(module.context); 
     } 
    }), 
    new webpack.optimize.CommonsChunkPlugin({ 
     name: 'common', 
     chunks: Object.keys(entries), 
     minChunks: Object.keys(entries).length 
    }) 
    ] 
} 

은 당신에게 달려하십시오 웹팩 설정 등으로

.