Gem provides a helper asset_path in javascript.

Add gem to your Gemfile

gem 'js_assets'

And run bundle install.

The current version supports only Sprockets 3.x. For Sprockets 2.x use version 0.0.10

gem 'js_assets', '<= 0.0.10'

In your application.js

//= require app_assets

This directive adds the method asset_path in the global scope.

Get the path to the template app/assets/javascripts/rubrics/views/index.html in javascript:

var path = asset_path('rubrics/views/index.html')
// the function will return for development:
// /assets/rubrics/views/index.html
// and for production
// /assets/rubrics/views/index-5eb3bb250d5300736006c8944e436e3f.html

You can look at the raw hash of assets by inspecting JsAssets::List.fetch on the Rails console or the global JavaScript variable, project_assets, in your browser's console.

js_assets would be pretty slow if it had to calculate the assets on every request! For performance reasons, js_assets therefore keeps a cache of assets and the cache will survive app restarts, even if you restart Spring during development. If you change js_assets' configuration or add/remove any asset files, you should delete tmp/cache under Rails root.

To automatically update app_assets.js when adding new files in app/assets, you can use the guard tool - it monitors the file system and performs actions when certain events occur. This can be useful during development.

To setup Guard, Add to Gemfile:

group :development do
  gem 'guard'
  gem 'guard-shell'
end

Add to Guardfile:

guard :shell do
    watch(%r{^app/assets/.*}) { `rm -rf tmp/cache` }
end

Run the command bundle exec to install the gems. Before starting to develop run guard:

$ bundle exec guard

Warning! This may adversely affect the rate of return assets list in the development environment. Since they will be compiled at each change.

For example we want to use templating Slim in AngularJS app. Let our templates will be in app/assets/webapp/. We make the following settings:

In general, the standard config to generate HTML from Slim would look something like this:

# config/application.rb
config.assets.paths << Rails.root.join('app', 'assets', 'webapp')

# config/initizlizers/assets_engine.rb
Rails.application.assets.register_engine('.slim', Slim::Template)

# config/environments/production.rb
config.assets.precompile += ['*.html']

By default, js_assets will make all "*.html" assets available, so we don't have to do any special js_assets config. To reference these templates in JavaScript, just include app_assets in application.js.

//= require app_assets

And now we get a path for these Slim-generated assets in our JavaScript! e.g. to reference the template app/assets/webapp/blogs/edit.html.slim:

var path = asset_path('blogs/edit.html')
// the function will return for development:
// /assets/blogs/edit.html
// and for production
// /assets/blogs/edit-5eb3bb250d5300736006c8944e436e3f.html

The asset_path function will be available to any JavaScript, including those you've generated from other syntaxes such as CoffeeScript.

Using JSAssets::List, you can specify, for example in the initializer, which assets will be available via the asset_path helper, and which should be excluded. By default, "*.html" is included.

You can configure this in application.rb or create an initialiser file like config/intializers/js_assets.rb and configure it there.

To add a file pattern to the list, use:

JsAssets::List.allow << '*.png'

To exclude:

JsAssets::List.exclude << '*.png'

Initially, the list is taken asset falling within the filter app/config/environments/production.rb

config.assets.precompile += ['*.html']

The default settings are:

JsAssets::List.exclude = ["application.js"]
JsAssets::List.allow = ["*.html"]

And remember to delete tmp/cache.

Be careful! If the list of available JsAssets::List.allow get a file that is inserted directive require app_assets, recursion will occur as sprockets will calculate the md5-based content. Generally, if you are using files like "application.js" with a list of "require" directives, you should exclude them using the .exclude setting above.

To determine if filename will be used with md5 hashes, js_assets will use the Rails config:

# Generate digests for assets URLs.
config.assets.digest = true

You can use the directive Rails asset_host by setting ActionController::Base.asset_host in the application configuration, typically in config/environments/production.rb:

config.action_controller.asset_host = "assets.example.com"

Copyright © 2013 Zaur Abasmirzoev <zaur.kavkaz@gmail.com>

JsAssets is distributed under an MIT-style license. See LICENSE for details.