既存プロジェクトにCompassが導入されている場合に備えて、最低限Sassのコンパイルだけでも行えるようにしておく

Sassのコンパイルはgulpを使用する事が多いのですが、自分以外が制作した昔のコードを触る時に、Compassというものが使用されている時があります。
がっつりコードを触る場合はgulpの設定からした方がいいのかもしれませんが、scssファイルにcompassが@importされている場合はなかなか面倒です。
少し書き換えるくらいなら、自分もCompassをインストールして使えるようにしておけば、すぐ対応できます。
というわけで今回はMacのCompassインストール方法と最低限の使い方についてまとめておきます。
ちなみに新規にCompassでのプロジェクト作成は2019年2月現在メジャーではありません。
あくまで既存のプロジェクトで使われている場合(「config.rb」ファイルがある場合)に使用することを前提としています。
Compassのインストール
gemのアップデート
まずはターミナルを開いて、gemのアップデートを行います。
$ gem update --system最新版が入っている場合は「Latest version currently installed. Aborting.」と返ってきますし、最新版じゃない場合はインストールが始まります。
ruby-sassのインストール
gemでSassのインストールをします。MacにはデフォルトでRubyが入っているので、すぐ導入が可能です。
$ sudo gem install sassMacログイン時のパスワードを聞かれるので入力してenterを押します。
バージョンを指定してインストール
もしバージョンを指定してインストールする場合は下記のコマンドでインストールします。
$ sudo gem install sass -v バージョンアップデートする場合
既にインストールしていて、アップデートがしたい場合は下記のコマンドを入力します。
$ sudo gem update sassCompassのインストール
いよいよCompassのインストールです。
$ sudo gem install compassCompassの使用
Compassの使用方法ですが、「config.rb」ファイルがあるディレクトリをターミナルで開いて下記コマンドを使用します。
$ compass watchファイルを更新すると自動でコンパイルされるようになります。
終了したい場合はcontrol + Cを押せば終了できます。
また、後ろにパスを指定すると特定のファイルを監視してコンパイルできるようになります。
$ compass watch ファイルパス
他にもいくつかコマンドがあったり「config.rb」での設定も色々ありますが、今回は最低限コンパイルできるようにする事が目的なので以上になります。

iTerm2を使いこなすために覚えておきたいショートカット集
Nuxt.jsで「Classic mode for store/ is deprecated and will be removed in Nuxt 3.」のエラーメッセージが表示される場合の対処法
WordPressのメディアライブラリで画像を追加するときに表示される「HTTP エラー」の解消方法
WordPressのカスタム投稿タイプを追加後、ページは存在しているはずなのに404になる場合の解決方法
アクセス解析ツールの定番!!Googleアナリティクスの登録方法
Visual Studio Codeでファイル差分の比較を行う方法
Visual Studio Codeで英単語のスペルチェックをしてくれる拡張機能「Code Spell Checker」
Apacheのテストページを非表示にする方法
Vue CLI 3でfaviconの設定をする方法
npm-scriptsでSCSSをコンパイルする環境を構築する方法
iTerm2で「Use System Window Restoration Setting」を設定しているとアラートが表示されて機能しない
Google Chromeのサイト内検索(カスタム検索)機能を別のプロファイルに移行する方法
iPadで入力モードを切り替えずに数字や記号をすばやく入力する方法
iPhoneやiPadでYouTubeの再生速度を3倍速や4倍速にする方法
Keynoteで有効にしているはずのフォントが表示されない現象
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
AirPodsで片耳を外しても再生が止まらないようにする方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
macOSのコマンドパレット比較!SpotlightとAlfred、Raycastどれを使えばいい?
1つのノートアプリにすべて集約するのをやめた理由|2025年時点のノートアプリの使い分け
Notionログイン時の「マジックリンク」「ログインコード」をやめて普通のパスワードを使う
AlfredでNotion内の検索ができるようになるワークフロー「Notion Search」
Gitで1行しか変更していないはずのに全行変更した判定になってしまう
Macでアプリごとに音量を調節できるアプリ「Background Music」
Macのターミナルでパスワード付きのZIPファイルを作成する方法
MacBook Proでディスプレイのサイズ調整をして作業スペースを広げる
SteerMouseの「自動移動」機能で保存ダイアログが表示されたら自動でデフォルトボタンへカーソルを移動させる
iPhoneでタッチが一切効かなくなった場合に強制再起動する方法