gitのブランチごとにCodeKit(ビルドツール)の設定を変える方法

Advertisement

git-and-codekit

このブログのWordPressテーマのバージョン管理にはgitを、ビルドツールにはCodeKit を使っています。CodeKitはSassをプロセスするのに使っているくらいですが、先日、gitでブランチを作って作業をしていたらCodeKitの設定で困ったことがありました。

起こった問題

まず、前提条件としてCodeKitの設定ファイルのcodekit.configはgitの管理下に置かず、masterブランチでstyle.scssに個別の設定を行っていました。そのあと、以下の作業を行ったら問題が発生してしまいました。

  1. gitで新たにdevelopブランチを作ってstyle.scssを修正
  2. masterブランチにdevelopブランチの修正をマージ
  3. CodeKitでstyle.scssに個別に設定していたファイルの書き出し設定が消えてしまった

style.scss/css/style.min.cssに書き出すように設定していたのに、その設定が消えてしまいました。その代りにCodeKitのプロジェクトごとのデフォルト設定が適用され/style.cssに書き出されるようになっていました。結果、テーマファイルが参照していたCSSが変更されず、ブラウザで見ても変更が反映されずに戸惑いました。

解決策

CodeKitの設定ファイル(config.codekit)をgit管理下に置いて、ブランチごとに設定を保持するよう、gitを設定しました。ちなみにそれぞれのバージョンは、gitはHomebrew版の2.6.0、CodeKitは2.6.1でした。

各ブランチのCodeKitの設定

CodeKitは、ブランチごとに以下の設定を行いました。

developブランチ

  • /css/style.min.cssにファイルを書き出す
  • 書き出し設定をNestedに
  • source mapを書き出す

masterブランチ

  • /css/style.min.cssにファイルを書き出す(developと同じ)
  • 書き出し設定をCompressedに
  • source mapを書き出さない

gitの設定

ブランチごとに異なるconfig.codekitファイルを保持できるように、gitに以下の設定を追加しました。

.git/configに以下を追加

[merge "ours"]
  name = "Keep ours merge"
  driver = true

.gitattributesに以下を追加

config.codekit merge=ours

まとめ

今回のこのgitの設定は他の状況でも応用できそうなので、覚えておいて損はなさそうです。

gitはコミットして履歴を残しておく程度にしか使っていなくて、もっと活用したいと思ってブランチを作って作業をしてみらたらすぐに問題にぶち当たってしまいました。使いこなせるまでにはいろいろ試す必要がありそうですけど、それまでは失敗しながら進むしかなさそうですね。そしたら、gitに助けられることも多くなるんでしょうね。早くそんな日が来ないかな。

参考サイト

About the author

Rriverのステッカーが貼られたMacBookの向こうにいる自分のMemojiの似顔絵

「明日のウェブ制作に役立つアイディア」をテーマにこのブログを書いています。アメリカの大学を卒業後、ボストン近郊のウェブ制作会社に勤務。帰国後、東京のウェブ制作会社に勤務した後、ウェブ担当者として日英バイリンガルのサイト運営に携わる。詳しくはこちら

ウェブ制作・ディレクション、ビデオを含むコンテンツ制作のお手伝い、執筆・翻訳のご依頼など、お気軽にご相談ください。いずれも日本語と英語で対応可能です。まずは、Mastodon @rriver@vivaldi.net Twitter @rriver 、またはFacebook までご連絡ください。