1. 2355

    Posted

    2355
Changes in title
+Node.js 開発環境構築
Changes in tags
Changes in body
Source | HTML | Preview

はじめに

Node.js 未経験者が初めて開発環境を構築したときの備忘録です。
Homebrew や git はインストール済みの前提です。

環境

macOS Catalina version 10.15.5
Homebrew 2.4.2
git version 2.22.0
fish, version 3.0.2

nodenv

anyenv

こちらはnodenv以外にもあるpyenv等、様々なenv系のツールをまとめてくれるもの。
今回はこちらを経由して nodenv をインストールする。
https://github.com/anyenv/anyenv

インストール

$ brew install anyenv

初期化します。

$ anyenv init
# Load anyenv automatically by adding
# the following to ~/.config/fish/config.fish:

status --is-interactive; and source (anyenv init -|psub)

なんか出るので従います。

$ vi ~/.config/fish/config.fish

# 以下を追記
status --is-interactive; and source (anyenv init -|psub)

config を読み直します

$ source ~/.config/fish/config.fish
ANYENV_DEFINITION_ROOT(/Users/mkitaya/.config/anyenv/anyenv-install) doesn\'t exist. You can initialize it by:
> anyenv install --init

またなんかでるので従います。

$ anyenv install --init
Manifest directory doesn\'t exist: /Users/mkitaya/.config/anyenv/anyenv-install
Do you want to checkout ? [y/N]: y
Cloning https://github.com/anyenv/anyenv-install.git master to /Users/mkitaya/.config/anyenv/anyenv-install...
Cloning into '/Users/mkitaya/.config/anyenv/anyenv-install'...
remote: Enumerating objects: 48, done.
remote: Total 48 (delta 0), reused 0 (delta 0), pack-reused 48
Unpacking objects: 100% (48/48), done.

Completed!

nodenv インストール

https://github.com/nodenv/nodenv

インストール

$ anyenv install nodenv

# shell 再起動
$ exec $SHELL -l

Node.js インストール

https://nodejs.org/ja/

# 一覧を確認
$ nodenv install -l

# バージョンを指定してインストール
# https://nodejs.org/ja/download/ を確認して、最新のLTSバージョンを選ぶ
$ nodenv install 12.18.1

# デフォルトで使用するバージョンを設定
$ nodenv global 12.18.1

# shell 再起動
$ exec $SHELL -l

# バージョンを確認
$ node -v
v12.18.1

ちなみに、 nodenv local を使うと特定のディレクトリで使用するバージョンを設定できます。

$ cd hoge/
$ nodenv local 12.18.0
# 上記を実行すると .node-version というファイルが作られる

$ node -v
v12.18.0

ここまでで Node.js を使えるようになりました。

Visual Studio Code

Node.js の開発を行う際に便利なエディタ

以下よりzipをダウンロード
https://code.visualstudio.com/
解凍するとappファイルが出てくるのでApplicationsディレクトリに移動してインストール完了。



:white_check_mark: 環境構築完了です。

参考

https://qiita.com/kyosuke5_20/items/eece817eb283fc9d214f