我正在運行Mac OS X Mountain Lion,並通過RVM輕鬆設置Ruby。然後我安裝了Middleman(http://middlemanapp.com/),它工作正常。我已經能夠添加配置設置並構建一個項目。Sass/Compass不能編譯使用Guard with Middleman setup
我的問題來自於嘗試使用Guard來編譯Sass/Compass,並鏈接到LiveReload以自動刷新我的瀏覽器。
我的中間人項目結構如下:
{項目名稱} /位點/源
(源是在相同的編譯爲「構建」文件夾中的中間人夾級)
我的Gemfile/config.rb/guardfile在這裏:
{項目名稱} /秒ite/
下面列出的是我的Gemfile,Config.rb和我的Guardfile。
的Gemfile:
# If you have OpenSSL installed, we recommend updating
# the following line to use "https"
source 'https://rubygems.org'
gem 'middleman', '~>3.0.12'
gem 'sass'
gem 'compass'
gem 'oily_png'
gem 'guard'
gem 'guard-compass'
gem 'guard-shell' # Run shell commands.
gem 'guard-livereload' # Browser reload.
gem 'rb-fsevent', :require => false # Mac OSX
Congid.rb(還包含一些配置爲中間人的構建,但沒有涉及到薩斯/北斗)
# Sass options:
# http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html#options
sass_options = Hash.new
# Enable Sass inspection directly from the browser.
#
# Chrome Canary support (Applies to Webkit Nightlies as well.):
# http://blog.q42.nl/post/35203391115/debug-sass-and-less-in-webkit-inspector-and-save-css-cha
# Firefox Extension:
# https://addons.mozilla.org/en-US/firefox/addon/firesass-for-firebug
#
# Set to true to enable. Enabling will disable `line_comments`.
#
sass_options[:debug_info] = true
##
# Compass configuration:
# http://compass-style.org/help/tutorials/configuration-reference
# Development is the default environment. When compiling for production, this
# should be flagged as :production. This can be done through the command line
# with the following.
#
# $ compass compile -e production --force
#
environment = :development
sass_dir = 'source/sass'
css_dir = 'source/css'
js_dir = 'source/js'
images_dir = 'source/img'
relative_assets = true
output_style = (environment == :production ? :compressed : :expanded)
Guardfile
# ~/.guardfile
# More info at https://github.com/guard/guard#readme
notification :off
puts "Using guard file for markweston project."
group :development do
if File.exists?("./config.rb")
# Compile on start.
puts `compass compile --time --quiet`
# https://github.com/guard/guard-compass
guard :compass do
watch(%r{(.*)\.s[ac]ss$})
end
end
## Look for specified files in the current and child directories.
## `find` requires Ruby 1.9 or greater.
require 'find'
if Find.find(Dir.pwd).detect{|dir|dir=~/.+\.(css|js|html?|php|inc|theme)$/}
guard :livereload do
watch(%r{.+\.(css|js|html?|php|inc|theme)$})
end
end
# Uncomment block above and remove this if using Ruby 1.9 or greater.
# https://github.com/guard/guard-livereload.
# guard :livereload do
# watch(%r{.+\.(css|js|html?|php|inc|theme)$})
# end
end
我可以運行'bundle exec guard'這個工具,當我在瀏覽器中運行LiveReload時,終端告訴我瀏覽器已經連接。
有一點要注意的是,我跑「捆綁EXEC後衛」後出現此錯誤:
NoMethodError上線[「264」] /Users/Mark/.rvm/gems/ruby-1.9的.3-p385/gems/compass 0.12.2/lib/compass/configuration/inheritance.rb:activate
在解決這個問題時遇到了一些麻煩。
主要問題是當我實際在我的sass目錄中保存的.scss文件之一中編寫任何Sass時,它們不會編譯爲我的css目錄中的.css文件。終端什麼也沒說,沒有任何反應。我的配置有問題,但無法弄清楚。
任何人都可以幫忙嗎?
謝謝,
馬克。
@CraigColes包括一個安裝項目的鏈接,這個鏈接很方便,但值得注意的是Middleman網站實際上是在Middleman中構建的,因此可能值得用作演示:[Middleman Guides]( https://github.com/middleman/middleman-guides),但它比另一個例子更復雜。 – 2013-04-09 18:45:59