【フロントエンド向け】MacBook Air（M1チップ）のセットアップ

2021年8月21日 19:28

個人用のMacが欲しくて半年ぐらい悩んでいたのだが、整備済製品にM1チップのMacBook Airが入っていたので、思い切って買ってみた。8コア8コアの512GBの16GBで14万円弱だったので、新品より2万円くらいお得だったはず。

で、セットアップで躓いたところもあったので、自分がやったことを紹介しておこうと久しぶりにnoteに書いてみた。

1-1. インストールしたもの

- VS code
- SourceTree
- Homebrew
- nodenv
- Node.js
- yarn

公式サイトから普通にDLして普通にインストールできた。プラグインのインストールも問題なかったので、いつも使ってるものをじゃんじゃん入れて終わり。

gitはCLIにどうも慣れないので、SourceTreeをインストール。これも公式サイトから問題なくDLとインストール完了。

さて、ここからが色々本題。まずお馴染みHomebrewさんのインストール。

これも公式にあるとおりにコマンドを叩く。

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

次に、nodeのバージョン管理をするため、nodenvのインストール。いままでnodebrewを使ってたが、nodenvのほうが便利やん？ってなって乗り換えた。

brew install nodenv

次にpathを通す。最近のMacだとターミナルが.zshrcだと思うので、下記の場所に.zshrcファイルを作って環境変数を書き込む。

/Users/{UserName}/.zshrc

export NODENV_ROOT="$HOME/.nodenv"
export PATH="$NODENV_ROOT/bin:$PATH"
if which nodenv > /dev/null; then eval "$(nodenv init -)"; fi

色々調べたけど、↑の記述じゃないとnodeのpathが通らなかった。

環境変数を設定したら、ターミナルを再起動する。

nodenvから必要Node.jsのバージョンを指定してインストール。

nodenv install 14.17.5
nodenv install 12.14.1

グローバルとローカルバージョンを設定。

nodenv global 14.17.5
nodenv local 12.14.1

ローカルでバージョン指定すると、ディレクトリ直下に.node-versionというファイルが作成されて、指定バージョンが記載される。gitで管理しておけば、チームで共有できるので便利。

Node.jsのバージョンを確認して、pathが通っていることと、指定バージョンが正しくインストールされていることを確認する。

node -v

yarnはnpmでインストールすると、nodenvでローカル指定したバージョンだと動かなかったので、Homebrewでインストールやり直した。

brew install yarn --ignore-dependencies

このコマンドなら、複数のnodeの依存関係を無視できるとのこと。

brew install yarnとしてしまうと、最新のNode.jsも一緒にインストールされてしまって、nodenvで入れたNode.jsが無視されてしまったので、↑のコマンドでインストールすのが良さそう。

正しくインストールできたか確認。バージョンが表示されればOK。

yarn -v

これでwebpackがあるディレクトリ配下でyarn installしたらちゃんと動いたので、とりあえず大丈夫そう。

これはM1だからどうのではなく、タイミングの話で、2021/8/13からGithubがパスワード認証を廃止していたせいだった。

個人用アクセストークンを別途作成して、それをパスワード聞かれたときにぶちこめばクローンできた。

SSHキーを登録してSSHでのクローンを試したけどどうもだめで、原因がわからなかったのでとりあえずHTTPSで認証することに。（これ原因がもしわかったら追記する）

初期セットアップについてはこのくらいかな。

自分宛てのメモ書きだけど、M1チップのMacを購入した人の参考になれば幸い。

この記事が気に入ったらサポートをしてみませんか？