「TailwindCSS」を使いたいと思ったのですが、npmを使用するのが良さそうなので、npmを使えるようにしたいと思います。
どうやら、「Node.js」をインストールすれば一緒に使えるようになるようです。
スポンサーリンクNode.jsのインストーラを取得
下記よりダウンロードします。
https://nodejs.org/en/download/
ポップアップが表示されるので、「ファイルを保存」をクリックします。
Node.jsをインストール
先ほどダウンロードした「node-vXX.XX.X-x64.msi」(Xはバージョンを表しています)を実行(ダブルクリック)します。
①「Next」をクリック
②「I accept・・・」にチェックし、「Next」をクリック
③インストールするフォルダを指定し、「Next」をクリック
※インストールするフォルダは基本的に変更する必要はありません
⑤「Next」をクリック
※不要なものは外してもOKです
⑥「Next」をクリック
※【要注意】「Python2」と「VisualStudioBuildTools」が後程インストールする必要あり?いくつかのnpmモジュールのコンパイルに失敗しそう…。npmが正常に動作しない場合は、ここをインストールします。(Python3は入ってるから、VisualStudioBuildToolsだけでOKなのかな…?判明した際は追記します→下記に追記)
早速「Tailwind CSS」のインストールでエラーになったので対処
上の画像のコメントで自分でインストールするなら・・・という下記URLを参考に「Visual Studio Community」をインストールしました。上の画像のチェックを入れてNode.js自体やり直そうかと思ったのですが、pythonのインストールはおそらく不要だろうということで、自分でインストールしました。
https://github.com/nodejs/node-gyp#on-windows
下記の「Visual Studio Community」をダウンロード・インストールしました。「https://github.com/nodejs/node-gyp#on-windows」にはバージョン2017とありましたが、2019で問題ありませんでした。
https://visualstudio.microsoft.com/ja/free-developer-offers/
次に、コマンドプロンプトを再起動し、「npm config set msvs_version 2017」と入力しEnter、「npm config set msvs_version 2019」と入力しEnterを押しました。
※「npm config set msvs_version 2017」はいらないと思いますが、やってしまったので念のため記載
これでエラーは改善されました。また、Python3でも問題ないようです。
⑦「Install」をクリック
⑧「Finish」をクリック※キャプチャは省略
以上でインストール完了です。
Node.js・npmがインストールされているか確認
①Windowsキー(旗マーク)+Rをクリックします。ファイル名を指定して実行が開きます。
②「cmd」と入力し、「OK」をクリックします。コマンドプロンプトが開きます。
③「node –version」と入力し「Enter」を押すと、node.jsのバージョンが表示されます。「npm –version」と入力し「Enter」を押すとnpmのバージョンが表示されます。どちらもバージョンが表示されればインストールできています。
スポンサーリンク