Atomのsass-autocompileで保存場所を指定する

atom scss

Atomでscssファイルを自動でコンパイルするためにsass-autocompileパッケージをインストールします。

保存場所を指定する

あまり必要がないかもしれませんが、コンパイルしたファイルの出力先を変更したい場合があります。 例えば次のようにscssファイルはscssフォルダ内にまとめて管理し、cssは各フォルダ内に出力したい場合などです。

root
  |-- contact
  |     |-- css
  |           |-- index.min.css
  |-- scss
        |-- contact
              |-- index.scss

パラメータで指定する

sass-autocompileでは最初の1行目のコメントでパラメータを指定することが出来ます。 そこで出力先を指定することで対応します。

// compileCompressed: ../../contact/css/$1.min.css

(以下省略)

WindowsのAtomにsass-autocomplileをインストールする方法

一応メモ書き。

nodistをインストールする

https://github.com/marcelklehr/nodistからインストーラーをダウンロードしてインストールする。

node-sassを確認する

エラーが出た場合、https://github.com/sass/node-sass-binaries からバイナリをダウンロードして vendorフォルダに入れる。

Error: Missing binding ...\nodist\bin\node_modules\node-sass\vendor\win32-ia32-47\binding.node

win32-ia32-47_binding.nodeファイルをbinding.nodeにリネームして、vendorフォルダにwin32-ia32-47フォルダを作成しその中に入れる。（win32-ia32-47の部分はエラーメッセージと同じものを使う）