Atomでsassを使いたいと思ったのでその方法をまとめました。


Atomにsassを導入してみた。

以前はcould9でsassを使っていたけど、いつも使ってるエディタのatomに導入しようと思った為。

導入方法

導入には「nodo.js」と「node-sass」のインストールが必要です。
Atomには、パッケージで「sass-autocompile」があるのでそのインストールまでまとめていきます。

nodo.jsのインストール

公式サイト:https://nodejs.org/ja/

公式サイトからインストールします。

ターミナルでnode-vを打ちインストールされてるか確認。
npm -vも同時にインストールされてるのでこちらも一応こちらも確認。

node -v
 v8.11.4
npm -v
 5.6.0

よしよし、インストール出来てますね。

node-sassをインストールする

次にnode-sassをインストールするためターミナルに
npm install -g node-sassを打ち込む。

npm install -g node-sass

しかしエラーが出てインストールされてません・・・。

エラーはアクセス権限がありません的な事が書かれてる。

下記のサイトを元にエラーを解決していく。
参照:http://codetofly.com/others/nodejs-node-sass-install/
参照:https://qiita.com/okoysm/items/ced3c3de30af1035242d

  • まずはnpm config get prefixで確認して見る。
npm config get prefix

すると結果がこちら

/user/local

npmフォルダのオーナーを自分のユーザー名に変更して、内包されているフォルダなどのパーミッションもこれで変えるため下記のコマンドを打つ。

sudo chown -R $(whoami) $(npm config get prefix)/{lib/node_modules,bin,share}

もう一度インストールを試みる。

npm install -g node-sass

無事、インストール出来ました!!!

確認でnode-sass -vでインストールが出来たか見てみる。

node-sass -v

うん!無事にインストール出来ました!

補足:Finderから/user/localに移動したかったが、見つからない〜と思ってましたが、
Finderのメニューから「移動」→「フォルダに移動」を選択。
/user/lodalを入力すると移動できました(^^)
参照:http://d.hatena.ne.jp/testnoda/20120515/1337069061

atomでパッケージをインストール

Atomを開いて、環境設定のインストールからsass-autocompileをインストールする。

同じく環境設定のパッケージに追加されて入れば成功です!!

実際は、エラーのところですごく時間を使ってしまいましたが、同じエラーの人がいたので同じように実行していけばすんなりいけました(^O^)

導入を考えてる人は参考にして下さい。お疲れ様でした!!!