あなたのnpmパッケージ、脆弱性の塊説。急いで最新にするよ！

npm便利ですよね。

昨今フロントweb開発でNode.jsが登場しないことはないので、みなさんお使いかと思いますが、ちゃんとバージョン管理していますか？

私はしがないweb制作者ですが、npmパッケージなしでの開発はありえないです。

ただそういえばバージョン管理をしていないなと思い、現在バージョンと最新バージョンを比べてみることに。そしたら...

```
$ npm outdated
```

<img width="513" alt="スクリーンショット 2020-05-22 20.25.53.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/472701/ae91be89-6be9-9702-b0ad-2107045fc11a.png">

`微妙にパッケージが古くなってた...`

## npm-check-updatesをインストール

まずはpackage.jsonを最新バージョンにアップグレードしてくれるnpm-check-updatesをインストールします。

```
npm i npm-check-updates
```

そしたら、

```
ncu -u
```
すると、
<img width="389" alt="スクリーンショット 2020-05-22 20.52.38.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/472701/26cfe612-5c60-f70f-ab24-a1b38c928ef1.png">


`Run npm install to install new versions.`

というメッセージが出たらOK、最後にパッケージをインストールします。

```
npm i
```

すると...

<img width="474" alt="スクリーンショット 2020-05-22 20.54.41.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/472701/71231385-fee7-9f8a-e338-a7071d62c57d.png">
何やら不穏なメッセージ。

**660の脆弱性があるから直すためにnpm audit fixしろよな！**

ということらしいです👀

ヒェ...
（npmの更新サボってた人はみんな数百レベルであると思われます）

とりあえずコマンドを実行します。脆弱性のある箇所を自動修正してくれるコマンドです。

```
npm audit fix
```

すると

<img width="505" alt="スクリーンショット 2020-05-22 21.00.49.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/472701/f373943d-66ab-c06f-b909-0fc274e9c3ae.png">

>残り12個の脆弱性は手作業でオナシャス！！

ということらしい。

マジかい。

```
npm audit
```

で脆弱性一覧を出してみる。

<img width="563" alt="スクリーンショット 2020-05-22 21.05.31.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/472701/994adec7-1a45-98a0-de58-24bce259720b.png">

15個の脆弱性のうち、一個の危険性が`high`になっていました（**脆弱性から正規表現を使ったDoS攻撃を受ける可能性があるそうです**）

highのものを詳しくみてみます。

```
───────────────┬──────────────────────────────────────────────────────────────┐
│ High          │ Denial of Service                                            │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ http-proxy                                                   │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Patched in    │ >=1.18.1                                                     │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ browser-sync [dev]                                           │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ browser-sync > http-proxy                                    │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://npmjs.com/advisories/1486                            │
└───────────────┴──────────────────────────────────────────────────────────────┘
```

`browser-syncが依存している、http-proxyに問題があるそう。なんぞこれ...?`

調べてみると、執筆時点5日前にアップデートが出ており、最新版にする必要がありそうです。

https://www.npmjs.com/advisories/1486

とりあえず

```
$ npm install http-proxy
```
で最新版をダウンロードし、再度脆弱性のある箇所を自動修正してくれるコマンド↓

```
npm audit fix
```

すると...

![スクリーンショット 2020-05-22 21.37.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/472701/ad6069f9-5baa-e27e-b822-ce0082592856.png)

```
fixed 9 of 13 vulnerabilities in 1275 scanned packages
  4 vulnerabilities required manual review and could not be updated
```

high消えたし、4つまで減らせたよかった！！

ぬわ〜ん疲れたも〜ん！！

## 結論 npmは定期的にお手入れせよ

バージョンは古くなってるし、脆弱性はあるし、多分自動化できるんだろうけど弱弱エンジニアなので、これから調べてみます。

みんなもnpmパッケージのバージョン管理、やろう！！