えにあです。
今回からWindowsでReactNative入門~環境構築編~をスタートしていきます。
ReactでもReactNativeでも、まずはNode.jsが必要ですのでインストールしていきます。
目次
前回まで
経緯についてはこちら。
enia.hatenablog.com
Node.jsのインストーラをダウンロードする
まずは以下の公式ページにアクセスしてNode.jsのインストーラをダウンロードしていきます。 nodejs.org
赤い枠の位置をクリックするとダウンロードが始まります。(サイズ29.1MB)
Node.jsをインストールする
ダウンロードが完了したらインストーラを実行します。
セットアップウィザードが起動したら、Nextを押します。
利用規約に同意して、Nextを押します。
インストールディレクトリを指定してNextを押します。デフォルトのディレクトリでよいでしょう。
カスタムセットアップの設定です。デフォルトのままNextを押します。
PythonやVisualStudio Build Toolsなどを一緒にインストールするか聞かれています。
チェックをいれてNextを押します。
任意項目ですので不要であればチェックしなくても構いません。
Installを押します。
インストールが始まります。30秒くらいで完了します。
インストールが完了しました。Finishを押します。
関連パッケージをインストールする(任意)
途中でPythonやVisual Studio Build Toolsをインストールする設定をいれた場合、以下のコマンドプロンプトが起動します。続行するために何かキーを押します。
画面が切り替わります。
PowerShellが起動してインストールが始まります。私の環境では15分ほどかかりました。インストールが完了したEnterキーを入力します。
これでインストールは完了です。
インストールの正常性確認
nodeコマンドとnpmコマンドが使えるようになっているはずです。
Power Shellを起動してnode --version
npm --version
を実行します。バージョン名が表示されれば正常にインストールされています。
PS C:\Windows\system32> node --version v14.17.6 PS C:\Windows\system32> npm --version 6.14.15
追加インストールを行った場合はpythonもインストールされています。python --version
を実行して、pthonがインストールされていることを確認します。
PS C:\Windows\system32> python --version Python 3.9.7 PS C:\Windows\system32>
Yarnのインストール
Yarnとは、主にJavaScriptで開発されたプログラム部品(モジュール)を管理するためのパッケージ管理システムの一つで、npmと互換性があります。
npmに比べ実行速度が高速です。パッケージの導入時に依存先のパッケージのバージョン番号を記録(yarn.lockファイル)するため、環境の再構築や他のコンピュータでの環境構築において正確に同じバージョンのパッケージを導入することができます。npmで許可されていたパッケージ導入時のコード実行が禁止され、パッケージの整合性をチェックサムで検証するなどセキュリティにも配慮しています。
2016年に米SNS大手フェイスブック(Facebook)社が自社環境でのパッケージ管理のために開発し、BSDライセンスに基づいてオープンソースソフトウェアとして公開しました。
yarnのインストール手順は下記の公式サイトに記載されています。 classic.yarnpkg.com
PowerShellを管理者権限で起動してnpm install --global yarn
コマンドでインストールします。
PS C:\Windows\system32> npm install --global yarn > yarn@1.22.11 preinstall C:\Users\xxxxx\AppData\Roaming\npm\node_modules\yarn > :; (node ./preinstall.js > /dev/null 2>&1 || true) C:\Users\xxxxx\AppData\Roaming\npm\yarn -> C:\Users\xxxxx\AppData\Roaming\npm\node_modules\yarn\bin\yarn.js C:\Users\xxxxx\AppData\Roaming\npm\yarnpkg -> C:\Users\xxxxx\AppData\Roaming\npm\node_modules\yarn\bin\yarn.js + yarn@1.22.11 added 1 package in 3.182s
yarnコマンドが利用可能になっていることをyarn --version
で確認します。
PS C:\Windows\system32> yarn --version
1.22.11
以上でyarnのインストールは完了です。
今回はここまで! 次回はAndroid Studioをインストールしていきます。