npmとyarnのコマンド早見表

**2019/12/24追記**

npmとyarnの脆弱性が報告されています。

> [npmとyarnの脆弱性とpostinstall - Cybozu Inside Out | サイボウズエンジニアのブログ] (https://blog.cybozu.io/entry/npm-vulnerabilities-and-postinstall)
> npmの利用者としてやるべきことは、
> 
> * npmのバージョンを6.13.4以上にあげる
> * yarnのバージョンを1.21.1以上にあげる

# 概要

npmとyarnの「よく使う」から「ときどき使う」くらいまでのコマンド早見表です。

**環境**

* Windows 10 Professional
* Nodist 0.8.8

**参考**

* [npm Documentation] (https://docs.npmjs.com/cli)
* [CLI の紹介 | Yarn] (https://yarnpkg.com/ja/docs/cli/)


# バージョン

Node.jsおよびnpmはNodistでインストール、yarnはnpmでインストールしました。

Node.js

```console
> node --version
v8.11.2
```

npm

```console
> npm --version
6.1.0
```

yarn

```console
> yarn --version
1.7.0
```

# コマンド

<table>
<thead>
  <tr>
    <th>実行内容</th>
    <th>npm</th>
    <th>yarn</th>
  </tr>
</thead>
<tbody>
  <tr>
    <td rowspan="2">インストール<br>パッケージ一覧</td>
    <td>
      <i>Global</i><br>
      <code>npm ls -g --depth=0</code>
    </td>
    <td>
      <i>Global</i><br>
      <code>yarn global list --depth=0</code>
    </td>
  </tr>
  <tr>
    <td>
      <i>Local</i><br>
      <code>npm ls --depth=0</code>
    </td>
    <td>
      <i>Local</i><br>
      <code>yarn list --depth=0</code>
    </td>
  </tr>

  <tr>
    <td rowspan="2">binの場所</td>
    <td>
      <i>Global</i><br>
      <code>npm bin -g</code>
    </td>
    <td>
      <i>Global</i><br>
      <code>yarn global bin</code>
    </td>
  </tr>
  <tr>
    <td>
      <i>Local</i><br>
      <code>npm bin</code>
    </td>
    <td>
      <i>Local</i><br>
      <code>yarn bin</code>
    </td>
  </tr>

  <tr>
    <td rowspan="2">node_modulesの場所</td>
    <td>
      <i>Global</i><br>
      <code>npm root -g</code>
    </td>
    <td>
      <i>Global</i><br>
      <code>N/A</code>
    </td>
  </tr>
  <tr>
    <td>
      <i>Local</i><br>
      <code>npm root</code>
    </td>
    <td>
      <i>Local</i><br>
      <code>N/A</code>
    </td>
  </tr>

  <tr>
    <td rowspan="2">インストール</td>
    <td>
      <i>Global</i><br>
      <code>npm install -g {package}</code>
    </td>
    <td>
      <i>Global</i><br>
      <code>yarn global add {package}</code>
    </td>
  </tr>
  <tr>
    <td>
      <i>Local</i><br>
      <p>:asterisk:  package.jsonに記録されているパッケージをインストール</p>
      <code>npm install</code>
      <p>:asterisk:  dependenciesにインストール</p>
      <code>npm install --save {package}</code>
      <p>:asterisk:  devDependenciesにインストール</p>
      <code>npm install --save-dev {package}</code>
    </td>
    <td>
      <i>Local</i><br>
      <p>:asterisk: package.jsonに記録されているパッケージをインストール</p>
      <code>yarn install</code>
      <p>:asterisk: dependenciesにインストール</p>
      <code>yarn add {package}</code>
      <p>:asterisk: devDependenciesにインストール</p>
      <code>yarn add --dev {package}</code>
    </td>
  </tr>

  <tr>
    <td rowspan="2">アンインストール</td>
    <td>
      <i>Global</i><br>
      <code>npm uninstall -g {package}</code>
    </td>
    <td>
      <i>Global</i><br>
      <code>yarn global remove {package}</code>
    </td>
  </tr>
  <tr>
    <td>
      <i>Local</i><br>
      <p>:asterisk: dependenciesからアンインストール</p>
      <code>npm uninstall --save {package}</code>
      <p>:asterisk: devDependenciesからアンインストール</p>
      <code>npm uninstall --save-dev {package}</code>
    </td>
    <td>
      <i>Local</i><br>
      <p>:asterisk: dependenciesからアンインストール</p>
      <code>yarn remove {package}</code>
      <p>:asterisk: devDependenciesからアンインストール</p>
      <code>yarn remove {package}</code>
    </td>
  </tr>

  <tr>
    <td rowspan="2">アップデート</td>
    <td>
      <i>Global</i>
      <p>:asterisk: 全体をアップデート</p>
      <code>npm update -g</code>
      <p>:asterisk: 指定したパッケージをアップデート</p>
      <code>npm update -g {package}</code>
    </td>
    <td>
      <i>Global</i>
      <p>:asterisk: 全体をアップデート</p>
      <code>yarn global upgrade</code>
      <p>:asterisk: 指定したパッケージをアップデート</p>
      <code>yarn global upgrade {package}</code>
    </td>
  </tr>
  <tr>
    <td>
      <i>Local</i>
      <p>:asterisk: 全体をアップデート</p>
      <code>npm update</code>
      <p>:asterisk: 指定したパッケージをアップデート</p>
      <code>npm update {package}</code>
    </td>
    <td>
      <i>Local</i>
      <p>:asterisk: 全体をアップデート</p>
      <code>yarn upgrade</code>
      <p>:asterisk: 指定したパッケージをアップデート</p>
      <code>yarn upgrade {package}</code>
    </td>
  </tr>

  <tr>
    <td rowspan="2">パッケージの情報</td>
    <td>
      <i>Global</i><br>
      <code>npm info -g {package}</code>
    </td>
    <td>
      <i>Global</i><br>
      <code>yarn info {package}</code>
    </td>
  </tr>
  <tr>
    <td>
      <i>Local</i><br>
      <code>npm info {package}</code>
      <p>:asterisk: jsonで出力</p>
      <code>npm info {package} --json</code>
      <p>:asterisk: 特定のフィールドの情報 (e.g. description)</p>
      <code>npm info {package} description</code>
    </td>
    <td>
      <i>Local</i><br>
      <code>yarn info {package}</code>
      <p>:asterisk: jsonで出力</p>
      <code>yarn info {package} --json</code>
      <p>:asterisk: 特定のフィールドの情報 (e.g. description)</p>
      <code>yarn info {package} description</code>
    </td>
  </tr>

  <tr>
    <td rowspan="2">古いパッケージ</td>
    <td>
      <i>Global</i>
      <p>:asterisk: 全体</p>
      <code>npm outdated -g</code>
      <p>:asterisk: 指定したパッケージ</p>
      <code>npm outdated -g {package}</code>
    </td>
    <td>
      <i>Global</i>
      <p>:asterisk: 全体</p>
      <code>N/A</code>
      <p>:asterisk: 指定したパッケージ</p>
      <code>N/A</code>
    </td>
  </tr>
  <tr>
    <td>
      <i>Local</i>
      <p>:asterisk: 全体</p>
      <code>npm outdated</code>
      <p>:asterisk: 指定したパッケージ</p>
      <code>npm outdated {package}</code>
    </td>
    <td>
      <i>Local</i>
      <p>:asterisk: 全体</p>
      <code>yarn outdated</code>
      <p>:asterisk: 指定したパッケージ</p>
      <code>yarn outdated {package}</code>
    </td>
  </tr>

  <tr>
    <td>キャッシュ</td>
    <td>
      <p>:asterisk: クリア</p>
      <code>npm cache verify</code>
      <p>:asterisk: 強制クリア</p>
      <code>npm cache clean --force</code>
      <p>:asterisk: 一覧</p>
      <code>N/A</code>
      <p>:asterisk: ディレクトリ</p>
      <code>N/A</code>
    </td>
    <td>
      <p>:asterisk: クリア</p>
      <code>yarn cache clean</code>
      <p>:asterisk: 強制クリア</p>
      <code>N/A</code>
      <p>:asterisk: 一覧</p>
      <code>yarn cache list</code>
      <p>:asterisk: ディレクトリ</p>
      <code>yarn cache dir</code>
    </td>
  </tr>

  <tr>
    <td>コンフィグ</td>
    <td>
      <p>:asterisk: 一覧</p>
      <code>npm config list</code>
      <p>:asterisk: デフォルト</p>
      <code>npm config list -l</code>
      <p>:asterisk: プロパティ名指定</p>
      <code>npm config get {プロパティ名}</code>
      <p>:asterisk: json</p>
      <code>npm config list --json</code>
    </td>
    <td>
      <p>:asterisk: 一覧</p>
      <code>yarn config list</code>
      <p>:asterisk: デフォルト</p>
      <code>N/A</code>
      <p>:asterisk: プロパティ名指定</p>
      <code>yarn config get {プロパティ名}</code>
      <p>:asterisk: json</p>
      <code>N/A</code>
    </td>
  </tr>

  <tr>
    <td>スクリプト</td>
    <td>
      <p>:asterisk: 一覧</p>
      <code>npm run</code>
      <p>:asterisk: 実行</p>
      <code>npm run {script}</code>
      <p>:asterisk: 環境変数の表示</p>
      <code>npm run env</code>
    </td>
    <td>
      <p>:asterisk: 一覧</p>
      <code>yarn run</code>
      <p>:asterisk: 実行</p>
      <code>yarn run {script}</code>
      <p>:asterisk: 環境変数の表示</p>
      <code>yarn run env</code>
    </td>
  </tr>

  <tr>
    <td>ローカルパッケージの実行</td>
    <td>
      <code>npx {package}</code>
      <p>npxの例を参照</p>
    </td>
    <td>
      <code>yarn -s run {package}</code>
      <p>　</p>
    </td>
  </tr>
</tbody>
</table>

# npm キャッシュのクリア

npm バージョン5以上で`npm cache clear`を実行するとエラーになります。これは`--force`オプションが必須となっているためです。

```
npm ERR! As of npm@5, the npm cache self-heals from corruption issues and data extracted from the cache is guaranteed to be valid. If you want to make sure everything is consistent
, use 'npm cache verify' instead. On the other hand, if you're debugging an issue with the installer, you can use `npm install --cache /tmp/empty-cache` to use a temporary cache in
stead of nuking the actual one.
npm ERR!
npm ERR! If you're sure you want to delete the entire cache, rerun this command with --force.
```

通常は、キャッシュが破損していないか一貫性を確認するためには、代わりに`cache verify`とします。

```
> npm cache verify
```

キャッシュ全体を削除するには従来どおり`--force`を指定します。

```
> npm cache clear --force
```

通常のキャッシュを利用せずに、一時的なキャッシュを利用するには`--cache`とパスを指定します。

```
> npm install --cache /tmp/empty-cache
```


# npxの例

npxを使うとローカル(node_modules\\.bin)にインストールされたパッケージをパスを指定せずに実行することができます。

**インストール**

```console
> npm install -g npx
```

```console
> npx --version
10.2.0
```

**npxの使用例**

node_modules\\.binにインストールされているuuidを実行してみます。

```console
> npm info uuid description
RFC4122 (v1, v4, and v5) UUIDs
```

```console
> npx uuid v1
0e98f3f0-7df3-11e8-bac0-c5a39d5528ee
```

**yarnの場合**

yarnの場合はrunコマンドで実行できます。

```console
> yarn -s run uuid v1
90303fd0-7df9-11e8-8f9f-4341d8d5b67a
```


# npm auditの例

auditはnpm 6.0で追加された脆弱性に関するレポートとfixを行ってくれるコマンドです。
パッケージのインストール時に、脆弱性(vulnerabilities)が報告されているパッケージがあった場合、下記のように出力されます。

```console
> npm install

// ...省略...

audited 10504 packages in 15.43s
found 4 vulnerabilities (1 low, 1 moderate, 2 critical)
  run `npm audit fix` to fix them, or `npm audit` for details
```

**npm audit**

セキュリティレポートを出力します。解決方法がある場合はその方法も出力されます。

```console
> npm audit

                       === npm audit security report ===

# Run  npm install --save-dev url-loader@1.0.1  to resolve 1 vulnerability
SEMVER WARNING: Recommended action is a potentially breaking change

  Moderate        Regular Expression Denial of Service

  Package         mime

  Dependency of   url-loader [dev]

  Path            url-loader > mime

  More info       https://nodesecurity.io/advisories/535



# Run  npm update macaddress --depth 5  to resolve 2 vulnerabilities

  Critical        Command Injection

  Package         macaddress

  Dependency of   css-loader [dev]

  Path            css-loader > cssnano > postcss-filter-plugins > uniqid >
                  macaddress

  More info       https://nodesecurity.io/advisories/654




  Critical        Command Injection

  Package         macaddress

  Dependency of   optimize-css-assets-webpack-plugin [dev]

  Path            optimize-css-assets-webpack-plugin > cssnano >
                  postcss-filter-plugins > uniqid > macaddress

  More info       https://nodesecurity.io/advisories/654



# Run  npm update fill-range --depth 6  to resolve 1 vulnerability

  Low             Cryptographically Weak PRNG

  Package         randomatic

  Dependency of   webpack-dev-server [dev]

  Path            webpack-dev-server > http-proxy-middleware > micromatch >
                  braces > expand-range > fill-range > randomatic

  More info       https://nodesecurity.io/advisories/157



found 4 vulnerabilities (1 low, 1 moderate, 2 critical) in 10534 scanned packages
  run `npm audit fix` to fix 3 of them.
  1 vulnerability requires semver-major dependency updates.
```

**npm audit fix**

レポートされている脆弱性を解決します。
下記の例では4件中3件が解決し、1件が未解決になっています。（脆弱性があるパッケージをアップデートすると破壊的変更があるためfixしなかったという状態です。）

```console
> npm audit fix

added 4 packages from 16 contributors, removed 2 packages and updated 2 packages in 15.415s
fixed 3 of 4 vulnerabilities in 10534 scanned packages
  1 package update for 1 vuln involved breaking changes
  (use `npm audit fix --force` to install breaking changes; or do it by hand)
```

**npm audit fix --force**

強制的にfixするには`--force`フラグを付けます。

```console
> npm audit fix --force

+ url-loader@1.0.1
added 73 packages from 29 contributors and updated 2 packages in 16.369s
fixed 1 of 1 vulnerability in 10532 scanned packages
  1 package update for 1 vuln involved breaking changes
  (installed due to `--force` option)
```

**npm audit**

すべて解決したかどうかをもう一度レポートで確認します。

```console
> npm audit

                       === npm audit security report ===

found 0 vulnerabilities
 in 10540 scanned packages
```

# Usage

## npm

コマンドの使い方一覧を表示

```
> npm -l
```

各コマンドの使い方

```
> npm <command> -h
```

## yarn

各コマンドの使い方

```
> yarn help <command>
```