[Susy2] Sass + Compass + Susy2 watch & compile error with grunt
バージョンの組合せによってエラーが出るよう。
いろいろありました。
[markdown]
ruby のバーションは 2.1.1 です。
“`prettyprinted
% rbenv version
2.1.1 (set by /Users/****/.rbenv/version)
“`
## 症状1: compass watch でエラー
それぞれ下記のバージョンを利用。
`compass install susy` で susy の設定を追加して、grunt でコンパイルして利用できていました。
“`prettyprinted
% compass -v
Compass 1.0.0.alpha.21
% sass -v
Sass 3.3.10 (Maptastic Maple)
% gem install susy
Fetching: susy-2.1.2.gem (100%)
Successfully installed susy-2.1.2
Parsing documentation for susy-2.1.2
Installing ri documentation for susy-2.1.2
Done installing documentation for susy after 0 seconds
1 gem installed
“`
別のプロジェクトを始めようと `compass create –using susy
`compass watch` するとエラーが表示されました。
“`prettyprinted
% compass watch sample_susy2
>>> Compass is watching for changes. Press Ctrl-C to Stop.
E, [2014-07-21T23:42:15.511810 #24804] ERROR — : Actor crashed!
Errno::ENOENT: No such file or directory – sysctl
/Users/****/.rbenv/versions/2.1.1/lib/ruby/gems/2.1.0/gems/celluloid-0.16.0.pre2/lib/celluloid/cpu_counter.rb:28:in “’
:
“`
## 症状2: susy を見失う
`compass watch` が動かせるようインストールし直してみます。
“`prettyprinted
% gem install sass
Successfully installed sass-3.3.10
Parsing documentation for sass-3.3.10
Done installing documentation for sass after 7 seconds
1 gem installed
% gem install compass
Fetching: sass-3.2.19.gem (100%)
Successfully installed sass-3.2.19
Fetching: compass-0.12.7.gem (100%)
Successfully installed compass-0.12.7
Parsing documentation for sass-3.2.19
Installing ri documentation for sass-3.2.19
Parsing documentation for compass-0.12.7
Installing ri documentation for compass-0.12.7
Done installing documentation for sass, compass after 13 seconds
2 gems installed
“`
なぜか違うバージョンがインストールされました。
“`prettyprinted
% compass -v
Compass 0.12.7 (Alnilam)
% sass -v
Sass 3.3.10 (Maptastic Maple)
% gem install susy
Successfully installed susy-2.1.3
Parsing documentation for susy-2.1.3
Done installing documentation for susy after 0 seconds
1 gem installed
“`
`compass watch` とコンパイルができることは確認。
“`prettyprinted
% compass w
>>> Change detected at 12:39:53 to: screen.scss
overwrite stylesheets/screen.css
>>> Compass is watching for changes. Press Ctrl-C to Stop.
“`
しかし、今度は susy を見失う。
susy を使ってプロジェクトを始めようとすると下記のエラー。
“`prettyprinted
% compass create –using suzy sample_susy2
No such framework: “susy”
“`
grunt でコンパイルすると下記のエラー。
“`prettyprinted
Running “compass:dev” (compass) task
Gem::ConflictError on line [“2099”] of /Users/****/.rbenv/versions/2.1.1/lib/ruby/site
_ruby/2.1.0/rubygems/specification.rb: Unable to activate susy-2.1.3, because sass-3.2.19
conflicts with sass (< 3.5, >= 3.3.0)
Run with –trace to see the full backtrace
Warning: ↑
“`
## 調査
stackoverflow で調べてみると、似たようなエラーの報告が多発しています。
バージョンの組合せに問題があるのかも？
### 最新バージョンにそろえてみる
`gem cleanup` でバージョンの古い gem を削除してみる。
“`prettyprinted
% gem cleanup
Cleaning up installed gems…
:
Attempting to uninstall susy-2.1.2
Successfully uninstalled susy-2.1.2
:
Attempting to uninstall compass-0.12.7
Successfully uninstalled compass-0.12.7
Attempting to uninstall compass-1.0.0.alpha.20
Successfully uninstalled compass-1.0.0.alpha.20
Attempting to uninstall compass-core-1.0.0.alpha.20
Successfully uninstalled compass-core-1.0.0.alpha.20
Attempting to uninstall sass-3.3.9
Successfully uninstalled sass-3.3.9
:
Attempting to uninstall sass-3.2.19
Successfully uninstalled sass-3.2.19
Clean Up Complete
“`
関連する gem のバージョンは下記となった。
“`prettyprinted
% gem list
*** LOCAL GEMS ***
:
compass (1.0.0.alpha.21)
compass-core (1.0.0.alpha.21)
compass-import-once (1.0.4)
:
sass (3.3.10)
:
susy (2.1.3)
:
“`
* `compass watch` でエラー。
* grunt で compass と susy の利用を確認。
### インストールし直してみる
アンインストールしてから、インストールし直してどんなバージョンが入るのか確認してみます。
“`prettyprinted
% gem uninstall susy
Successfully uninstalled susy-2.1.3
% gem uninstall compass
You have requested to uninstall the gem:
compass-1.0.0.alpha.21
middleman-3.3.3 depends on compass (>= 0.12.4)
sprockets-sass-1.2.0 depends on compass (~> 1.0.0.alpha.19, development)
sprockets-sass-1.1.0 depends on compass (~> 1.0.0.alpha.19, development)
If you remove this gem, these dependencies will not be met.
Continue with Uninstall? [yN] y
Remove executables:
compass
in addition to the gem? [Yn] y
Removing compass
Successfully uninstalled compass-1.0.0.alpha.21
% gem uninstall sass
You have requested to uninstall the gem:
sass-3.3.10
compass-core-1.0.0.alpha.21 depends on sass (< 3.5, >= 3.3.0)
compass-import-once-1.0.4 depends on sass (< 3.5, >= 3.2)
middleman-3.3.3 depends on sass (< 4.0, >= 3.2.17)
sprockets-2.12.1 depends on sass (~> 3.1, development)
sprockets-sass-1.2.0 depends on sass (~> 3.3, development)
sprockets-sass-1.1.0 depends on sass (~> 3.3, development)
tilt-1.4.1 depends on sass (>= 0, development)
If you remove this gem, these dependencies will not be met.
Continue with Uninstall? [yN] y
Remove executables:
sass, sass-convert, scss
in addition to the gem? [Yn] y
Removing sass
Removing sass-convert
Removing scss
Successfully uninstalled sass-3.3.10
“`
“`prettyprinted
% gem dependency susy
No gems found matching susy (>= 0)
% gem dependency sass
No gems found matching sass (>= 0)
% gem dependency compass
Gem compass-core-1.0.0.alpha.21
bundler (>= 0, development)
multi_json (~> 1.0)
rake (>= 0, development)
sass (< 3.5, >= 3.3.0)
Gem compass-import-once-1.0.4
bundler (~> 1.3, development)
diff-lcs (>= 0, development)
rake (>= 0, development)
sass (< 3.5, >= 3.2)
sass-globbing (>= 0, development)
% gem uninstall compass-core-1.0.0.alpha.21
% gem uninstall compass-import-once-1.0.4
% gem uninstall compass-import-once
You have requested to uninstall the gem:
compass-import-once-1.0.4
middleman-3.3.3 depends on compass-import-once (= 1.0.4)
If you remove this gem, these dependencies will not be met.
Continue with Uninstall? [yN] y
Successfully uninstalled compass-import-once-1.0.4
% gem uninstall compass-core
Successfully uninstalled compass-core-1.0.0.alpha.21
“`
インストールします。
* compass 0.12.7 は sass 3.2.19 を要求。
* susy 2.1.3 は sass 3.3.10 を要求。
“`prettyprinted
% gem install compass susy
Fetching: sass-3.2.19.gem (100%)
Successfully installed sass-3.2.19
Fetching: compass-0.12.7.gem (100%)
Successfully installed compass-0.12.7
Parsing documentation for sass-3.2.19
Installing ri documentation for sass-3.2.19
Parsing documentation for compass-0.12.7
Installing ri documentation for compass-0.12.7
Done installing documentation for sass, compass after 10 seconds
Fetching: sass-3.3.10.gem (100%)
Successfully installed sass-3.3.10
Fetching: susy-2.1.3.gem (100%)
Successfully installed susy-2.1.3
Parsing documentation for sass-3.3.10
Installing ri documentation for sass-3.3.10
Parsing documentation for susy-2.1.3
Installing ri documentation for susy-2.1.3
Done installing documentation for sass, susy after 8 seconds
4 gems installed
“`
この状態では下記となります。
* `compass watch` で利用を確認。
* grunt で compass と susy を利用するとエラー。
## 対応
やはりそれぞれの gem の組合せでエラーが発生するよう。
Bundler を利用してバージョンをコントロールします。
“`prettyprinted
% bundle init
“`
Gemfile を編集します。
> * [Error using Compass 1.0alpha, Sass 3.3, and Susy 2.1.2 – Stack Overflow](http://stackoverflow.com/questions/24408466/error-using-compass-1-0alpha-sass-3-3-and-susy-2-1-2)
> * [compass | RubyGems.org | your community gem host](https://rubygems.org/gems/compass/versions/1.0.0.alpha.13)
“`ruby:Gemfile
gem “compass”, “~> 1.0.0.alpha.21”
gem “susy”, “~>2.1.0”
gem “sass”, “~>3.3.0”
“`
インストールします。
“`prettyprinted
% bundle
Fetching gem metadata from https://rubygems.org/………..
Fetching additional metadata from https://rubygems.org/..
Using chunky_png 1.3.1
Using multi_json 1.10.1
Installing sass 3.3.10
Using compass-core 1.0.0.alpha.21
Using compass-import-once 1.0.4
Using rb-fsevent 0.9.4
Using ffi 1.9.3
Using rb-inotify 0.9.5
Installing compass 1.0.0.alpha.21
Installing susy 2.1.3
Using bundler 1.6.4
Your bundle is complete!
Use `bundle show [gemname]` to see where a bundled gem is installed.
Post-install message from compass:
Compass is charityware. If you love it, please donate on our behalf at http://umdf.org/compass Thanks!
“`
結論としては以下となります。
* Sass + Compass + susy2 を使うためには、Compass 1.0.0 を使わねばならない。
* （現状）バージョン管理が必要なため、Bundler を利用する。
* （現状）`compass watch` は使えないため、grunt で監視する必要がある。
今後のバージョンアップで解決されると思いますがメモ。
## 補遺
インストールや grunt の設定などに関しては、下記で補足します。
> * [Compass: Susy2 をインストールする | deadwood](https://www.d-wood.com/blog/2014/07/23_6431.html)
[/markdown]