## 概要
以下のようなコードがある。
```ts
// デフォルト設定
const DEFAULT_SETTINGS = {
a: 1,
b: 2,
c: {
c1: 1,
c2: 2,
c3: {
c31: 1,
c32: 2,
},
},
};
// 現在の設定
const settings = {
a: 1,
b: 111,
c: {
c1: 10,
c3: {
c31: 999,
},
},
};
const result = { ...DEFAULT_SETTINGS, ...settings };
```
設定を読み込むコードでデフォルト設定をベースとし、ユーザーが設定した値があれば上書きするコードを意図している。しかし、この結果は期待通りにならない。
```json
{
"a": 1,
"b": 111,
"c": {
"c1": 10,
"c3": {
"c32": 999
}
}
}
```
これは、`c`の値が`DEFAULT_SETTINGS.c`で上書きされてしまうため。これを解決したい。
## 解決方法
[[ts-deepmerge]]を使う。
```ts
import merge from "ts-deepmerge";
// 中略
const result = merge(DEFAULT_SETTINGS, settings);
```
出力は以下のようになる。
```json
{
"a": 1,
"b": 111,
"c": {
"c1": 10,
"c2": 2,
"c3": {
"c31": 999,
"c32": 2
}
}
}
```