Intellij IDEAでSassとかを個別に自動コンパイルするメモ

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

こんにちは

新人のs-tomoデス。

本当はAngularJSについて書きたかったんですが、内容丸かぶりのブログ見つけてしまったので、急遽のネタ替えデスorz

今回はIDEについてご紹介。

【Intellij IDEAを使う】

そんなわけで、いきなりですが、皆さんは何のIDEを使っていますか?

社内はeclipse一色なんですが、自分ひねくれものなので、AngularJSやSass、CoffeeScriptを快適に使いたくて、(この記事を書いている)一ヶ月ほど前からIntellij IDEA使い始めました。

それで、そのIntellij IDEA(PhpStormも同じ)でCoffeeScriptとかSassとかを使うとき、File > Settings > File WatcherにあるFile Watcherで設定をしておくと自動コンパイルしてくれるので非常に便利なわけです。
Watcher

【設定】

こいつについては、他にも解説してくれている人がいるわけですが、他のブログとかにある設定通りにすると、対象の拡張子を持つファイル全てに自動コンパイルが適用されてしまいます。

えぇ、そいつは困るわけですヨ。

例えば、sassとかで、


main.scss

@import "hogehoge1.scss";
@import "hogehoge2.scss";

みたいな感じに、ひとつのcssに纏めるようなとき、パーツとなるscssをそれぞれcssにしているとフォルダが汚れるし無駄ですよね。

それで、ファイルごとに処理を分けるのはどうするのかなぁ?と。
調べたけど日本語では見つけられんかったです。

初め、output filterで設定するかと思い時間を無駄にしましたがww
灯台下暗しというかなんとうか、ただ無駄に悩んでしまったわけですが、どこを弄るかというと、scopeでした。

Edit Watcherのscopeの横の…ボタンを押すと、Scopesが開きます。

Scopes

後はPatternフォームに処理を適応したいファイルの条件を書いていけばいいだけです。
基本的にファイル名でのマッチングになります。
因みに正規表現は使えないっぽいです。
複数ファイルは||(or)で、除外は!(not)、あと*も使えます。

いや、パスで引っ掛けたいんだzeという方はfile:とかsrc:とか使ってください><

文法ルールについては詳しくは
http://www.jetbrains.com/idea/webhelp/scope-language-syntax-reference.html
に載っています。

Intellij IDEAはまだまだ奥が深いので、もっと使いこなせるようになりたいですね♡





広告システムについてのお問い合わせやご相談、パッケージ製品の詳細はこちらからどうぞ。
http://admage.jp/
アプリ計測SDK admage for Appのお問い合わせ・詳細はこちら。
http://apptizer.jp/

  • このエントリーをはてなブックマークに追加
  • Pocket
  • LINEで送る

コメントを残す

*