ページのイメージ
WEB開発 2018/02/21

コマンドを使わずにSASSをコンパイルしよう

  •  
  • このエントリーをはてなブックマークに追加

こんにちは、マークアップ担当の中村です。

すっかりSASSに慣れて、もはやSASSなしで作るのが辛く感じるようになりました。

自社サービスなどはエンジニアが環境構築してくれるのですが、自分で用意しなければならない時もありますよね。

そんな時に見つけたコンパイルアプリをご紹介しようと思います。

コマンドいらずのGUIアプリケーション「koala」です。

 

koalaダウンロードページ

●Koalaとは

コマンドを打たなくてもSassのコンパイルができるGUIアプリケーション。
無料で日本語対応。
koalaを起動したままsass/scssを編集、保存すればコンパイルしてくれるようになります。

ダウンロードはこちら

手順は2ステップ

(1)Koalaをダウンロードし、インストールする
(2)koalaにコンパイルしたいSASSもしくはSCSSファイルをドラック&ドロップ

以上です。簡単ですね!!

さらに使いやすくするための設定もご紹介します。

 

日本語表示にする

設定マークの所から言語設定できます。

日本語を選択したら再起動して設定完了です。

 

自動コンパイルする

(1)コンパイルしたいファイルクリック

(2)右に出るメニューの一番上の「自動コンパイル」にチェックする

koalaを起動しておけば、SASSファイルを書き換え、保存するだけでコンパイルしてくれるようになります。

 

コンパイル先を指定する

フォルダ構成は「SASS」と「CSS」に分けたいですね。

(1)左メニューのフォルダを右クリック

(2)「プロジェクト設定」>「設定ファイルを作成」

(3)「for Sass」を選択

(4)SASSファイルが入っているフォルダに「koala-config.json」が生成されます。

(5)koala-config.json」を編集。テキストエディタなどで編集します。

koalaのconfig設定

デフォルトではコメントアウトされている”mappings”のところを使います。

使ってみた感想

他のアプリケーションをいろいろ使っている時はさすがに処理しきれなくなることもありますが、重さなどは特に気にならなかったです。

とりあえずサクッと作っちゃいたい時などに、環境を整える手間が減るのは大変ありがたいです。

コマンドに抵抗感を持っている方にもSASSでの作業をお願いしやすくなりますね。


しずおかオンライン中途採用社員も、積極募集中!
「womo」「イエタテ」のスタッフとして、地域の魅力を伝える仕事です。
くわしくはこちら!

Category

Ranking