javascript_include_tag Rails 4 generating "/javascripts/" instead of "/assets" in production

Question

I have a Rails 4 application with

<%= javascript_include_tag "modernizr", "data-turbolinks-track" => true %>

in the head. In development, the following HTML is rendered, and modernizr is loaded:

<script data-turbolinks-track="true" src="/assets/modernizr.js?body=1"></script>

In production, the followign HTML is rendered, and modernizr is not loaded (404 not found):

<script data-turbolinks-track="true" src="/javascripts/modernizr.js"></script>

In production, /assets/modernizr.js is found and browsable.

The Rails documentation says that the javascript_include_tag should generate

<script data-turbolinks-track="true" src="/assets/modernizr.js?body=1"></script>

In production, my stylesheet_link_tags are fine, linking to the /assets/ directory.

Why is the javascript_include_tag linking to /javascripts instead of /assets in production, and how can I fix it?

Answer 1

One of the usage statements for AssetUrlHelper indicates it will produce /javascripts/ urls like what you are seeing:

# asset_path "application", type: :javascript # => /javascripts/application.js

(from asset_url_helper.rb line 117 - [1])

This code looks like it can only be reached if the precompiled asset is missing so it would appear that your asset compilation is not working (my deployments usually fail when that happens, so maybe yours isn't even firing).

The same asset_url_helper.rb calls the /javascripts/ part 'extname' and uses the following map to know how to generate the name:

 # Maps asset types to public directory.
  ASSET_PUBLIC_DIRECTORIES = {
    audio:      '/audios',
    font:       '/fonts',
    image:      '/images',
    javascript: '/javascripts',
    stylesheet: '/stylesheets',
    video:      '/videos'
  }

A new Rails 4 app has this in the config/environments/production.rb

  # Do not fallback to assets pipeline if a precompiled asset is missed.
  config.assets.compile = false

which seems to match the behavior you are seeing.

Answer 2

By default, Rails only precompiles application.js, application.css and any images it finds in the assets path. Therefore, in production mordernizr will not get precompiled and thus the javascript helpers will not be able to find the file.

In order to fix the issue, you can add modernizr to the precompile list by modifying the following config in production.rb

config.assets.precompile += ['modernizr.js']

For more information see the Rails Guides

Answer 3

Be sure to precompile your assets in production by running this command:

RAILS_ENV=production bundle exec rake assets:precompile

The Rails Guide on the asset pipeline can give you more details: http://guides.rubyonrails.org/asset_pipeline.html#precompiling-assets

Answer 4

I have a new application using Rails 4 deployed on Heroku with :

<%= javascript_include_tag "application", "data-turbolinks-track" => true %>

my javascript application.(fingerprint).js called from the src: assets/application.js

i think your problem come from something into your production.rb who define assets from another location.

So maybe you can add Moderniz.js to

config.assets.precompile = ['.js', '.css', '*.css.erb']

in config/production.rb

Or simply require modernizr script into your application.js

//= require mordernizr

and remove the modernizr script call into your layout.

<%= javascript_include_tag "modernizr", "data-turbolinks-track" => true %>

Can you check from where your application.js is served into your production environment ?

Answer 5

It may be because this file needs to be in /vendor/assets/javascript instead of /app/assets/javascript. The Vendor folder is for javascript libraries, and the App folder is for your code.

A better solution than adding a tag to your layout would be adding a script reference to your application.js and let the sass compiler compress and attach it to your main javascript file.

If you don't get a definitive answer, check out: http://guides.rubyonrails.org/asset_pipeline.html#asset-organization