茶鏡のブログ

駆け出しのWebデザイナーが文句ばっかりぐちぐちぐちぐち言う日記です。

Windows8.1にMiddlemanをいれようとして難儀したメモ

お調べ Web制作

なぜ Middleman

Middlemanとは「スタティックサイトジェネレータ」と言われるものです。
競合？ではjekyll が有名ですね。

これからちょっと規模の大きい（とはいうものの数十ページのWebサイトですが）案件が始まりそうで、「ヘッダーとか共通部分どないしょう…」と悩んでおりましたとき、ちょうど下記の記事を見つけました。

静的サイト開発ツールとしてのMiddlemanとGrunt - Webtech Walker

これは今後もしかしたら使えるかもしれないと思い、会社のマシンにいれることにしました。ちょうど暇だったしね。

こちらの解説もわかりやすそうで大変ありがたい。
[ Middlemanで超速プロトタイピング ] #01 Middleman の基礎を一気に学ぶ - Developers.IO

追記 4/12
Hamlを覚えていない人は、公式サイトのリファレンスもとてもわかりやすいです。

今回はMacとWindows両方にいれてみたのですがコレが難儀をきわめるとは…！

注意andもくじ

私は開発やRubyもそうですが、その前にWindowsに詳しくないのでおかしな点がある可能性が多いあります。
あくまでよくわかってない人のメモとしてご覧いただき、お試しは自己責任でお願いします。

  • 要件とやりたいこと
    • インストールするPC
    • 今回の目標
  • 詰まったところ
    • 1.EventMachineがおかしい?
    • 2.wdmが読み込まれない
    • 3.知らない間にbundlerを使っていた？！
  • そのほか、気付きや補足
  • コレがキッカケで

要件とやりたいこと

インストールするPC

今回の目標

  • $ Middleman server でサーバーをたちあげる！
    (その後の問題については、今回は無視。)

詰まったところ

1. EventMachineがおかしい?

インストールの段階で「EventMachineがインストールされてないよ」と言われましたので、普通に、

$ gem install EventMachine

でインストールしてみたのですが、刃が立たず。

なんとこの問題についてEventMachineを修正したという勇者がいらっしゃいました。

Windows 7 に Ruby 2.0 x64 を その5 ～EventMachine の問題と対策～ - Ruby と iPhone と UI と

この記事に掲載の修正版をありがたく使わせていただくことにしました。ありがとうございます。
pull request送った！ってとのことですが反映されているのでしょうか。

2.wdmが読み込まれない

本家によりFixされてる？

コレ超難儀しました。インストールは無事（？）にうまくいき、さあついにサーバーを立ちあげ！の段階で「wdmがみつからないよ！」と怒涛の文字数で怒られました。

$ gem install wdm

でインストールされたはずなんですけどねぇ。

Middleman本家のGitHubのissueにも同じような報告がありまして、「Gemfile templateにwdmを入れておいたよ！」とまるっとFixされたようです。

しかしわたくしのマシンではまったくダメでございました。

プロジェクト内のGemfileの設定で解決。かも。

StackOverflowなどで、他のライブラリで困っている方がいらしていて、Gemfileの設定に問題があるんじゃないか説が浮上しました。

試行錯誤の結果、下記の方法で奇跡的にサーバーが立ち上がりました。まだなんか怒られるけど。

ちなみに、この記事にもありましたが、localhost:3456で立ち上がりました。なんでやろう。

この段階でプロジェクトの作成はできるようになったので、プロジェクトを作成します。

$ middleman init my_project

my_project内の「Gemfile」の設定を下記に書き換えていきます。

例のwdmの設定。

★before
gem "wdm", "~> 0.1.0", :platforms => [:mswin, :mingw]
★after
gem "wdm", "~> 0.1.0", :platforms => [:mswin, :x64_mingw]

tzinfo-dataについても同様。

★before
gem "tzinfo-data", platforms: [:mswin, :mingw]
★after
gem "tzinfo-data", platforms: [:mswin, :x64_mingw]

そのつぎに、my_project内の「Gemfile.lock」の設定を書き換えていきます。

specs:からはじまる、gemのパッケージのリスト（sassなどですね！）のいちばん下に、 wdm (~> 0.1.0)を書き足す

※tzinfo-dataについても書き足す必要があるかもです。

GemFileの設定の問題が浮上して、この辺りを適当に触っていたら、エラーメッセージで有効なオプションを教えてくれました。
今回、Rubyのコマンドプロンプトがあったのでその画面から作業していたのですが、最初立ち上がるときにRubyのバージョンとともに[x64-mingw32]って出ていたので一番近いものを入れてみたという…。

3.知らない間にbundlerを使っていた？！

エラーメッセージで「bundle install」で足りないものを補完できるよ！って言われたもんだから………さ……。
そこは別途お勉強が必要な項目です。

そのほか、気付きや補足

  • Windowsでは、32bitバージョンをインストールするとスムーズなようです。Ruby本体とDevKitを32bitにそろえてインストールする必要があります。
  • まだこれは「サーバーが立ち上がった〜！やったね〜！」の段階ですので、少しずつ使っていきます。
  • Macはというと、Macにあらかじめ入っているRubyのバージョンが古かったのでhomebrewでバージョンを上げ、切り替えました。これはこれでよくわからんので怖い。
  • Middlemanの開発チームは全員Macで開発されていてWindowsでは確認できないよ〜って（笑）本家にWindows対応する義務はないです。

コレがきっかけで

Middleman、そして黒い画面とと仲良くできたら良いなぁ。
よくわからずに使って難儀なことになるっていうリスクは、多少あるのですが、それはGUIでも変わらないかなと。

で、こんな記憶があるんですよ…。わたしはMiddlemanむきやわ！って聞いた記憶が…。なんやったかなぁ…。