npm install --global expo-cli がエラーになる



## 目次
第１回　[React NativeでMapboxを使ったiOSアプリを作る](https://qiita.com/ppt_msdg_maas/items/5585a1ada4c634d38ccb)
第２回　npm install --global expo-cli がエラーになる　→今ココ

## 概要
第１回の内容をM1 Macで再現した際に、`npm install --global expo-cli`でエラーになったので、
それの解決方法を紹介します。

#### 実行コマンドとエラー

`npm ERR! Error: EACCES: permission denied, access '/usr/local/lib/node_modules'`
ここら辺が怪しいそうです。

```
% npm install --global expo-cli
npm WARN deprecated @hapi/joi@17.1.1: Switch to 'npm install joi'
npm WARN deprecated @hapi/address@4.1.0: Moved to 'npm install @sideway/address'
npm WARN deprecated @hapi/pinpoint@2.0.0: Moved to 'npm install @sideway/pinpoint'
npm WARN deprecated @hapi/formula@2.0.0: Moved to 'npm install @sideway/formula'
npm WARN deprecated core-js@2.6.12: core-js@<3.3 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.
npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated har-validator@5.1.5: this library is no longer supported
npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
npm WARN deprecated uuid@3.3.2: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated chokidar@2.1.8: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
npm WARN deprecated fsevents@1.2.13: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
npm WARN deprecated joi@11.4.0: This version has been deprecated in accordance with the hapi support policy (hapi.im/support). Please upgrade to the latest version to get the best features, bug fixes, and security patches. If you are unable to upgrade at this time, paid support is available for older versions (hapi.im/commercial).
npm WARN deprecated topo@2.0.2: This version has been deprecated in accordance with the hapi support policy (hapi.im/support). Please upgrade to the latest version to get the best features, bug fixes, and security patches. If you are unable to upgrade at this time, paid support is available for older versions (hapi.im/commercial).
npm WARN deprecated hoek@4.2.1: This version has been deprecated in accordance with the hapi support policy (hapi.im/support). Please upgrade to the latest version to get the best features, bug fixes, and security patches. If you are unable to upgrade at this time, paid support is available for older versions (hapi.im/commercial).
npm WARN deprecated uuid@3.0.0: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN deprecated uuid@2.0.3: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
npm WARN checkPermissions Missing write access to /usr/local/lib/node_modules
npm WARN @pmmmwh/react-refresh-webpack-plugin@0.3.3 requires a peer of react-refresh@^0.8.2 but none is installed. You must install peer dependencies yourself.

npm ERR! code EACCES
npm ERR! syscall access
npm ERR! path /usr/local/lib/node_modules
npm ERR! errno -13
npm ERR! Error: EACCES: permission denied, access '/usr/local/lib/node_modules'
npm ERR!  [Error: EACCES: permission denied, access '/usr/local/lib/node_modules'] {
npm ERR!   errno: -13,
npm ERR!   code: 'EACCES',
npm ERR!   syscall: 'access',
npm ERR!   path: '/usr/local/lib/node_modules'
npm ERR! }
npm ERR! 
npm ERR! The operation was rejected by your operating system.
npm ERR! It is likely you do not have the permissions to access this file as the current user
npm ERR! 
npm ERR! If you believe this might be a permissions issue, please double-check the
npm ERR! permissions of the file and its containing directories, or try running
npm ERR! the command again as root/Administrator.
```

## 原因
正直謎ですが、シェルをbashからzshに変更したので、それが原因かもしれません。

## やったこと
結論を言うと、**npmのデフォルトディレクトリを変更**しました。


まず、[こちらのサイト](https://qiita.com/okohs/items/ced3c3de30af1035242d)を参考に、
Node.jsとnpmを再インストール(`npm install -g npm`)しましたが、解決せず。

そのため、npmのデフォルトディレクトリを変更する手順を行いました。
***その前に！***
npm globalリストを取得します。

### npm globalリストを取得
npmのデフォルトディレクトリを変更すると、
npm globalのリストが消えてしまうので、メモがてらやります。

```
% npm ls -g --depth=0
/usr/local/lib
├── eslint@7.8.1
├── eslint-plugin-react@7.20.6
├── firebase-tools@8.10.0
├── n@6.5.1
├── npm@6.14.6
├── typescript@4.0.2
└── yarn@1.22.4
```

### npmのデフォルトディレクトリを変更
[こちらのサイト](https://qiita.com/okohs/items/ced3c3de30af1035242d)を参考に、コマンドを実行します。

1. PCのバックアップを行う
1. グローバルインストールのためのディレクトリを作成する
`mkdir ~/.npm-global`

1. 新しいディレクトリを使う設定をnpmで行う
`npm config set prefix '~/.npm-global'`

1. ~/.profileを開くか作成し，以下の行を追加する
`export PATH=~/.npm-global/bin:$PATH`

1. 3の変更を反映する
`source ~/.profile`

1. npm globalリストにあるライブラリを全部追加する
`npm install -g <ライブラリ名>@<バージョン>`


### expo-cliのインストール
```
% npm install --global expo-cli
+ expo-cli@4.5.2
added 1792 packages from 788 contributors in 191.908s
```

インストールに成功しました。


### expoプロジェクトの作成
```
% expo init react-native-mapbox-demo
zsh: command not found: expo
```
expoコマンドが見つからないようです。
おそらくシェルをzshに変更したから発生した模様

### パスを通す
```
echo 'export PATH="/usr/local/Cellar/node/14.17.0/bin/:$PATH"' >> ~/.zshrc
source ~/.zshrc
echo 'export PATH=$PATH:~/.npm-global/bin' >> ~/.zshrc
source ~/.zshrc
```

### expoコマンドの実行
```
% expo -V
4.5.2
```
expoコマンドが実行できました！

```
% expo init react-native-mapbox-demo
```

もちろん、プロジェクト作成も成功です！

## 最後に
`npm install --global expo-cli`でエラーになった際の解決方法を紹介しました。
解決の糸口になったら幸いです。
次こそ、Mapboxのマップオプション周りの設定を解説する予定です。お楽しみに！

## 宣伝
パーソルプロセス＆テクノロジー株式会社（以下パーソルP&T）、システムソリューション（SSOL）事業部所属の堀江です。

私はモビリティソリューションデザインチームに所属しており、**モビリティ（ここでは移動手段全般）に関するサービスを考えたり、アプリを構築したりしております。**

いわゆる**「MaaS」**に取り組んでおります。

私たちが「MaaS」に取り組む中で、**現在活用している、もしくは活用する予定の技術やサービスやとりあえず発信したいこと**などなど、幅広くチームメンバーと共に執筆していきたいと思います。
メンバーごとに違った内容を発信していきますので、お楽しみに！

また、「MaaS」について詳しく知りたい方は、チームメンバーの吉田が記事を掲載しておりますので、
ぜひそちらをご覧ください。

[「MaaSとは」でたどり着いて欲しい記事　（1/3 前編）](https://note.com/ppt_msdg_maas/n/naae427dbc37c)
[「MaaSとは」でたどり着いて欲しい記事　（2/3 中編）](https://note.com/ppt_msdg_maas/n/na45c90b2f02f)
[「MaaSとは」でたどり着いて欲しい記事　（3/3 後編）](https://note.com/ppt_msdg_maas/n/n8fd724f7db6c)


**最後まで読んでいただき、ありがとうございました！**