Question

I configured my application to work on Heroku, but I’m having a problem. In development mode, when I change a part of the CSS and refresh the browser, my CSS doesn’t load.

I checked the logs, and the application.css doesn’t load. I need it to load every time in development mode. Also, my application.js stopped working and I dont know why.

development.rb:

  # Do not compress assets
  config.assets.compress = false
  config.assets.precompile += %w( login.css )

  # Expands the lines which load the assets
  config.assets.debug = true

enviroment.rb:

  config.active_record.whitelist_attributes = true

   # Enable the asset pipeline
   config.assets.enabled = true

   # Version of your assets, change this if you want to expire all your assets
   config.assets.version = '1.0'

   config.assets.initialize_on_precompile = true

I compile the assets manually using $ rake assets:precompile RAILS_ENV=development and it works except for the application.js code:

//= require jquery
//= require jquery_ujs
//= require_tree .
//= require jquery.reveal
$(document).ajaxStart(function() {
    $( "#load_img" ).animate({
            height:"toggle",
      opacity:"toggle"
        });
});

$(document).ajaxSuccess(function() {
    $( "#load_img" ).fadeOut('fast');
});

$(document).ready(function() {
  setTimeout(
    function() {
      $("#flash_messages").fadeOut(3000)
    }, 
    2500);
});

Everything worked before deploying to Heroku.

Answer 1

You don’t require the application.js file itself. Use require_self like so:

//= require jquery
...
//= require_self

$(function() {});

Also pretty sure you’re supposed to have a line break between the end of the includes and the start of the code in the application.js file itself.

Also this line:

config.assets.precompile += %w( login.css )

should probably be in application.rb and not just development.rb, although if you are manually precompiling assets in development mode before deploying to Heroku it shouldn’t matter.