Passos
1) Exclua Gemfile.lock
em seu projeto, se existir
2) Atualize seu Guardfile
e Gemfile
(a configuração pressupõe WordPress – portanto, eles devem estar na raiz do tema) com o código correspondente abaixo
3) Executar bundle install
no terminal enquanto estiver no diretório
4) Executar juicer install yui_compressor
, juicer install closure_compiler
,juicer install jslint
5) Executar guard -i
no terminal
Gemfile
source "https://rubygems.org"
gem 'rake'
gem 'guard'
gem 'coffee-script'
gem 'rb-fsevent'
gem 'rb-inotify'
gem 'sass'
gem 'compass'
gem 'sass-globbing'
gem 'compass-validator'
gem 'oily_png'
gem 'css_parser'
gem 'uglifier'
gem 'guard-compass'
gem 'guard-concat'
gem 'guard-process'
gem 'guard-uglify', github: 'pferdefleisch/guard-uglify'
gem 'guard-livereload'
gem 'juicer'
gem 'therubyracer'
end
Guardfile
# Compile stylesheet (compass watch)
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
# Minify CSS
guard 'process', :name => 'Minify CSS', :command => 'juicer merge assets/css/style.css --force -c none' do
watch %r{assets/css/style.css}
end
# Minify JS
guard 'process', :name => 'Minify application javascript', :command => 'juicer merge assets/js/app.js --force -s' do
watch %r{assets/js/app.js}
end
# Livereload
guard :livereload do
watch(%r{.+.(css|js|html?)$})
end
Últimos Passos e Resultado
- Altere os caminhos conforme necessário no Guardfile (a
assets/js/*
parte) - Agora, ao salvar seus arquivos principais .sass , .scss , .js , o compass irá compilar o arquivo CSS e o juicer irá minimizar os arquivos CSS / JS.