Using Compass on Heroku: /tmp for stylesheets remotely and locally - ruby-on-rails-3

I'm currently using Compass with Heroku using this configuration recommended on the Heroku knowledge base. Heroku has a read-only file system, and so the compiled stylesheets need to be stored in /tmp. This works fine remotely on Heroku; locally, however, Rails expects to find stylesheets in /public/stylesheets (when called through = stylesheet_link_tag 'screen.css', :media => 'screen, projection').
In order to solve the problem, I have created symbolic links in /public/stylesheets using ln -s tmp/stylesheets/screen.css public/stylesheets/screen.css and that seems to work.
Is there a way to solve this problem without using symbolic links, perhaps by changing some configuration in Rails? I've poked around without much success.
Here is my config/initializers/compass.rb:
require 'compass'
require 'compass/app_integration/rails'
Compass::AppIntegration::Rails.initialize!
# Required for Heroku:
require 'fileutils'
FileUtils.mkdir_p(Rails.root.join("tmp", "stylesheets"))
Compass::AppIntegration::Rails.initialize!
Rails.configuration.middleware.delete('Sass::Plugin::Rack')
Rails.configuration.middleware.insert_before('Rack::Sendfile', 'Sass::Plugin::Rack')
Rails.configuration.middleware.insert_before('Rack::Sendfile', 'Rack::Static',
:urls => ['/stylesheets'],
:root => "#{Rails.root}/tmp")
And here is my config/compass.rb:
project_type = :rails
project_path = Compass::AppIntegration::Rails.root
# Set this to the root of your project when deployed:
http_path = "/"
# Necessary for Heroku (original commented out:
css_dir = 'tmp/stylesheets'
#css_dir = "public/stylesheets/compiled"
sass_dir = 'app/views/stylesheets'
environment = Compass::AppIntegration::Rails.env
Any help would be greatly appreciated.

I was actually just about to set up Compass with our Rails application, which is hosted on Heroku, so cheers for giving me an excuse to work through this. :)
The answer is simple:
Modify 'config/compass.rb':
project_type = :rails
project_path = Compass::AppIntegration::Rails.root
http_path = "/"
environment = Compass::AppIntegration::Rails.env
if environment == 'production'
css_dir = "tmp/stylesheets"
sass_dir = "app/views/stylesheets"
else
css_dir = "public/stylesheets"
sass_dir = "app/stylesheets"
end
Then modify 'config/initializers/compass.rb':
require 'compass'
require 'compass/app_integration/rails'
Compass::AppIntegration::Rails.initialize!
require 'fileutils'
FileUtils.mkdir_p(Rails.root.join("tmp", "stylesheets"))
environment = Compass::AppIntegration::Rails.env
if environment == 'production'
Compass::AppIntegration::Rails.initialize!
Rails.configuration.middleware.delete('Sass::Plugin::Rack')
Rails.configuration.middleware.insert_before('Rack::Sendfile', 'Sass::Plugin::Rack')
Rails.configuration.middleware.insert_before('Rack::Sendfile', 'Rack::Static',
:urls => ['/stylesheets'],
:root => "#{Rails.root}/tmp")
end
... and voila, you're good.

ok, I'm a big heroku and compass fan myself so i've been through this many times
Heroku's docs, whilst giving correct information, provide poor advice in this instance.
When using compass, the best thing to do, 99.999% of the time is turn it off in production mode.
This means that you compile your stylesheets on your development machine and then add them to your git repo before pushing to heroku.
You will suffer a reasonably sizeable performance hit if you allow compass to compile on the server.
So here's what I do:
You should have a config.ru file at the base of your app. Open it and add the following:
require 'sass/plugin/rack'
use Sass::Plugin::Rack
Sass::Plugin.options[:never_update] = true
You can then remove quite a lot of the code from your initializer (especially the part where you unload Sass::Plugin::Rack). Additionally you will want to remove the if statement from compass.rb in config folder
Think about it, why would you want Sass to compile a stylesheet on the server? It just eats up processing power. Hope this helps,
EDIT::
PS - I should add that you will need to run compass watch from the command line now in order to get your stylesheets to compile in your dev environment

The recommended Heroku configuration will also work locally.
Removed the second 'Compass::AppIntegration::Rails.initialize!' from config/initializers/compass.rb, you only need it once.
Ensure your scss files are in 'app/views/stylesheets'
On both local and production servers the stylesheets will be compiled to tmp/stylesheets, and a request to /stylesheets will resolve to tmp/stylesheest. No need for two separate configurations.

Related

Rails 3 Development Asset Pipeline Directs to Public Folder

I just pulled down two new rails 3.2.6 projects that I have designated for some clean up. While attempting to make some UI changes I realized that even in development the asset pipeline was routing towards the public/assets folder.
After making some changes to the scss, I ran rake assets:clean followed by rake assets:precompile. Both ran without error and I restarted my localhost, and the styling was broken.
I've walked through the rails asset pipeline guide, as well as some other documentation that hasn't really provided the answer I need.
I attempted adding config.serve_static_assets = falseto the development.rb file in the config folder, however this as well did not render any scss.
Can anyone explain what is happening, and the best method of resolution?
Thanks
Add below statement to development.rb to prevent loading of files from public/assets.
config.serve_static_assets = false
Now restart the server, You will get better view.
To precomple the code in Test mode. -
Add this configuration to test.rb
config.assets.compile = false
config.serve_static_assets = true

How to get the error log from SASS when using the rails asset pipeline?

I've got 3 Rails 3.2 applications using the gem jquery-ui-themes. jquery-ui-themes uses scss for the image-path helper.
It works great on two of my applications, but the 3rd doesn't seem to compile the scss files in either development or production modes.
IOW, it sends this to the browser
background: #fcfdfd url(image-path("jquery-ui/redmond/ui-bg_inset-hard_100_fcfdfd_1x100.png")) 50% bottom repeat-x;
whereas the two working apps properly send
background: #fcfdfd url("/assets/jquery-ui/redmond/ui-bg_inset-hard_100_fcfdfd_1x100.png") 50% bottom repeat-x;
I've spent many hours trying to make the app that's broken as similar to possible to the two working apps as I can, but it's still failing.
My theory is that SASS is choking on something previous to redmond.css.scss. If so, there should be an error logged somewhere. Where do I find the error output from SASS?
Update:
I introduced a deliberate error into redmond.css.scss and I got a proper error dump. So I know that I'm correctly clearing the cache and actually running sass. Now to figure out why it's ignoring the image-path directives.
If you're looking for the answer to the question in the title, the answer is "the same way you get any other errors: they're in your log". To get a full backtrace, just point your browser at the asset: ie http://localhost:3000/assets/jquery-ui/redmond.css in my case.
Make sure you clear all your caches: rm -rf .sass-cache/ && rm -rf public/assets && rake tmp:cache:clear, as well as using ctrl-shift-r in your browser.
If you're looking for the answer for my real problem (image-path not working), make sure you have the proper Bundler.require line in your application.rb. The old Rails 3.0 doesn't work.
replace:
# If you have a Gemfile, require the gems listed there, including any gems
# you've limited to :test, :development, or :production.
Bundler.require(:default, Rails.env) if defined?(Bundler)
with:
if defined?(Bundler)
# If you precompile assets before deploying to production, use this line
Bundler.require(*Rails.groups(:assets => %w(development test)))
# If you want your assets lazily compiled in production, use this line
# Bundler.require(:default, :assets, Rails.env)
end

Javascript file is not updated in development with Rails

I changed a JS file under app/assets/javascripts but it is still the same. I deleted the file and re-created but the content is still the old one. This is my development.rb file:
App::Application.configure do
# Settings specified here will take precedence over those in config/application.rb
config.serve_static_assets = false
# In the development environment your application's code is reloaded on
# every request. This slows down response time but is perfect for development
# since you don't have to restart the web server when you make code changes.
config.cache_classes = false
# Log error messages when you accidentally call methods on nil.
config.whiny_nils = true
# Show full error reports and disable caching
config.consider_all_requests_local = true
config.action_controller.perform_caching = false
# Don't care if the mailer can't send
config.action_mailer.raise_delivery_errors = false
# Print deprecation notices to the Rails logger
config.active_support.deprecation = :log
# Only use best-standards-support built into browsers
config.action_dispatch.best_standards_support = :builtin
# Do not compress assets
config.assets.compress = false
# Expands the lines which load the assets
config.assets.debug = true
config.action_mailer.delivery_method = :letter_opener
config.action_mailer.default_url_options = { :host => "lvh.me:3000" }
# Raise exception on mass assignment protection for Active Record models
# config.active_record.mass_assignment_sanitizer = :strict
# Log the query plan for queries taking more than this (works
# with SQLite, MySQL, and PostgreSQL)
config.active_record.auto_explain_threshold_in_seconds = 0.5
config.log_tags = [:uuid, :remote_ip]
end
The JS file is loaded inside the header tag with this code:
<script src="/assets/deals.js?body=1" type="text/javascript"></script>
which is the normal way JS is loaded in development
Try to clear precompiled assets:
bundle exec rake assets:clean
Try to delete the tmp folder and then restart the server - rails s.
That will do it.
bundle exec rake assets:clean and then bundle exec rake assets:precompile
Or delete the public/assets folder, and restart the app
Check for sprockets-rails gem
In my case I upgraded to Rails 7, and for some reason, the javascript files were not updated. Spent many hours trying to work out why.
I finally discovered the culprit - in my case - somehow, I had removed the sprockets-rails gem. I could have easily lost many months trying to figure this out.
I have similar issue in my app running Rails 6 and 7. When I add console.log into one of the javascript controllers there won't be any log in the browser console, and it looks like the console.log is not even there.
I have been having issue for quite some time and have not been able to pinpoint the exact reason, it might be due to bundler installed globally, conflict between rvm and asdf, config for overmind, yarn or npm. But I found the 3 commands that resolve this problem for some time and I usually run them one after another
rails assets:clobber
rake tmp:cache:clear
rake assets:precompile

Make asset pipeline act like production on development

I am experiencing some problems with assets on production: missing ones, stuff compiled into the wrong files (javascript for "/admin" getting compiled into the frontend code and so on). Most of the assets come from engines. I want to debug and optimize this.
For that, I need to precompile, serve and fail on my development environment just like it is done on production.
I have added some lines to my config/development.rb:
config.serve_static_assets = true
config.assets.precompile += %w( store/all.js store/all.css admin/all.js admin/all.css ) # #TODO: clean up, and optimize.
config.assets.compile = false
Running this with rake RAILS_GROUPS=assets RAILS_ENV=development assets:precompile gives me all the assets and the manifest.yml in public/.
But then the server fails:
Sprockets::Helpers::RailsHelper::AssetPaths::AssetNotPrecompiledError in Spree/home#index
Showing /xxxx/app/views/spree/shared/_head.html.erb where line #13 raised:
favicon.ico isn't precompiled
favicon.ico isn't precompiled. But it is! Its there, in the public dir, in manifest.yml, and I can fetch it with the browser (or wget): http://localhost:3000/assets/favicon.ico.
NOTE Favicon is simply the first asset called. If I strip out favicon, the problem simply surfaces with the next asset, being "all.js", or, when that is stripped, "all.css", and so on. I can strip it untill "footer_bg.png", and it will then fail there. Again: the problem is not favicon, but the fact that the development environment does not see the precompiled assets at all.
What more is needed to get development asset pipeline similar to production?
EDIT: More explicit explanation that favicon is not the problem, merely a symptom.
I ended up installing an apache, passenger on localhost to troubleshoot.
Apache (could probably be any passenger-able server) because of the static asset serving.
Furthermore, on localhost I can bump the verbosity of apache in its logs very high, offering me enough debug information.
Passenger to emulate the ruby version and the gem-loading as much as possible as on production.
Running on webrick is just too different, even when emulating as close as possible, it proved too different from a production stack; which is why I could not reproduce the production problems in there,
Firing up the whole stack as if it were production allowed me to troubleshoot. Which lead me to conclude that several problems were causing the asset-woes: a gems assets not being picked up; a permission issue (compiled assets not readable by www-data) and a few assets not being compiled properly.
I think you may want to leave favicon.ico in public...
alzabo0:~ $ rails --version
Rails 3.2.3
alzabo0:~ $ rails new ojoijoijo
[...]
create public/404.html
create public/422.html
create public/500.html
create public/favicon.ico
create public/index.html
create public/robots.txt
[...]
Just a guess, but try adding to your precompile list:
config.assets.precompile += %w( store/all.js store/all.css admin/all.js admin/all.css favicon.ico)

How can I run SOME initializers when doing a Rails assets:precompile?

Background
I have an app that I recently updated to Rails 3.2.1 (from Rails 3.0.x) and have refactored the JS and CSS assets to make use of the new asset pipeline. The app is hosted on Heroku with the Celadon Cedar stack.
App Config
I keep application specific configuration in a YAML file called app_config.yml and load it into a global APP_CONFIG variable using an initializer:
# config/initializers/load_app_config.rb
app_config_contents = YAML.load_file("#{Rails.root.to_s}/config/app_config.yml")
app_config_contents["default"] ||= {}
APP_CONFIG = app_config_contents["default"].merge(
app_config_contents[Rails.env] || {} ).symbolize_keys
Asset Compilation on Heroku
Heroku has support for the Rails asset pipeline built into the Cedar stack. When you push an app to Heroku it automatically calls rake assets:precompile on the server as a step in the deploy process. However it does this in a sandboxed environment without database access or normal ENV vars.
If the application is allowed to initialize normally during asset precompilation an error is thrown trying to connect to the database. This is easily solved by adding the following to the application.rb file:
# Do not load entire app when precompiling assets
config.assets.initialize_on_precompile = false
My Problem
When initialize_on_precompile = false is set, none of the initializers in config/initializers/* are run. The problem I am running into is that I need the APP_CONFIG variable to be available during asset precompilation.
How can I get load_app_config.rb to be loaded during asset compilation without initializing the entire app? Can I do something with the group parameter passed to Rails::Application.initialize! ?
Rails lets you register initializers only in certain groups, but you need to use the Railtie API:
# in config/application.rb
module AssetsInitializers
class Railtie < Rails::Railtie
initializer "assets_initializers.initialize_rails",
:group => :assets do |app|
require "#{Rails.root}/config/initializers/load_config.rb"
end
end
end
You don't need to check if AppConfig is defined since this will only run in the assets group.
And you can (and should) continue to use initialize_on_precompile = false. The load_config.rb initializer will be run when initializing the app (since it's in config/initializers) and when pre-compiling without initializing (because of the above code).
Definitely check out asset_sync on github. Or our Heroku dev centre article on Using a CDN asset Host with Rails 3.1 on Heroku.
The issues with environment variables have recently been solved by a Heroku labs plugin, that makes your application's heroku config variables accessible during compilation time. To enable this, read about the user_env_compile plugin.
Also. There is quite a big performance improvement in using asset_sync vs letting your application lazily compile assets in production or serving them precompiled directly off your app servers. However I would say that. I wrote it.
With asset_sync and S3 you can precompile assets meaning all the assets are there ready to be served on the asset host / CDN immediately
You can only require the :assets bundle in application.rb on precompile, saving memory in production
Your app servers are NEVER hit for asset requests. You can spend expensive compute time on, you know. Computing.
Best practice HTTP cache headers are all set by default
You can enable automatic gzip compression with one extra config
Here's what I came up with. In the assets that need app configuration, I place this line at the very beginning:
<% require "#{Rails.root}/config/initializers/load_config.rb" unless defined?(AppConfig) %>
... and add .erb to the file name, so that video_player.js.coffee becomes video_player.js.coffee.erb. Then I can safely use AppConfig['somekey'] afterwards.
During the asset pre-compilation, it loads app config despite the initialize_on_precompile set to false, and does it only once (which avoids constant redefinition issues).
Yes, it's a kludge, but many times nicer than embedding configs in asset files.
For Heroku I am running the Asset Sync gem to store my files on a CDN to avoid hitting Heroku for static images. It works nicely. I also have initialize on precompile false, but the Asset Sync runs it's own initializer so you could put your code in that. https://github.com/rumblelabs/asset_sync
Although your intializer is not run when the assets are precompiling, you should still find that they run as Rails boors up as normal, however, this will be on the first hit to the application rather than at the deploy step.
I'm not entirely sure what the issue you're having is, but if you follow the Rails conventions the deploy will work as expected.