LoginSignup
0
0

More than 5 years have passed since last update.

Windows版Atomにauto-sasscompileをインストールする:補足

Posted at

WindowsのAtomにauto-sasscompileをweblifetimes.comの記事を参考にインストールしようとした時に、ちょっと躓いたので、補足として記事に残しておこうと思います。

読みやすくするために一部記事が重複していますが、ご了承ください。

インストールに必要なもの

  • node.js
  • node-sass

node-sassのインストールに必要なもの

  • python 2.7
  • C++ Build tools

node.jsをインストールする

nodejs.org から、node.jsをダウンロードしてインストールする

スクリーンショット 2017-07-19 22.30.54.png

筆者はLTSを使用しました。

インストール後の確認

node -v
npm -v

両方ともバージョンが表示されればOKです。

node-sassのインストール

とりあえず以下のコマンドでインストールを試みます。

npm install -g node-sass

うまくインストールできたら、Atomのsass-autocompileパッケージをインストールするまで進んでください。

エラーになった場合
- Python2が見つからない
- VBuild.exeが見つからない
のどちらかのエラーが出ている可能性が高いです。

エラーの出力量が多いので、探すのに少し手間取るかもしれません。

  • Python2が見つからない場合は、Python2.7(python2系の最新)をインストールします
  • VBuild.exeが見つからない場合は、VC++ Build Toolをインストールします

python2.7のインストール

  • python.org からpython2.7をインストールします

スクリーンショット 2017-07-14 15.13.17.png

画面キャプチャがMac OSになっていますが、Windowsに読み替えてください。

  • インストール後に、npmのconfigにpythonの設定を行います 以下のコマンドで設定します
npm config set python python2.7

VC++ Build Toolsをインストールする

CBuildTools.png

  • ここでは、2015年版をインストールしたものとしてコマンド例を記述します

再度node-sassのインストールを試みる

npm install -g node-sass
  • VC++ Build Toolsをインストールした場合はコンパイラのバージョンを指定してインストールします
npm install -g node-sass --msvs_version=2015

インストールが成功したらバージョンを確認します

node-sass -v

Atomのsass-autocompileパッケージをインストールする

この手順は、weblifetimes.comの記事sass-autocompileのインストールセクションに則って行なってください。

必要に応じてMapファイルの作成にチェックを入れる

  • atomの環境設定からsass-autocompileのパッケージの設定を開き、Build Source Mapにチェックを入れる

turn_on_build_map.png

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0