WESEEK Tips wiki

{{pagename}} - {{sitename}}

# 素の Webpack に於ける split chunk

- splitting chunk と vendor chunk (共通ライブラリの切り出し)は表裏一体
- https://qiita.com/soarflat/items/1b5aa7163c087a91877d


# Angular に於ける split chunk 手段メモ
- `vendorChunk` オプションがデフォルト通り false になっている場合の効果検証から。


## 1. multi app + `vendorChunk` option
- angular-cli の枠組みでの手段
- multi app 下では、`angular.json` で multi app にするのが一番素直
- model, service の共通化とその後のメンテコストが少なければこれをやればいい

## 2. lazy loaded route (component)
- Angular の枠組みでの手段
- multi/single app 問わず、lazy loaded route (component) にしてしまうってのも一つの解。
- Angular 力が必要になり、「モジュール単位で清潔さを保つ」というmodel, service の共通化とはまた別のコストが発生するが、それ自体が促進されるのは良いことである。


## 3. Dynamic import
- ES6 Module の枠組みでの手段
- Webpack の仕組みを利用
- https://qiita.com/jkr_2255/items/8d3b58f993c8739e211

splitting chunk に関するメモ

素の Webpack に於ける split chunk

Angular に於ける split chunk 手段メモ

1. multi app + vendorChunk option

2. lazy loaded route (component)

3. Dynamic import

1. multi app + `vendorChunk` option