Add vendor/assets/javascripts to my valid assets route - ruby-on-rails

I'm trying to make this work but it's driving me mad. I already set this in
application.rb
config.assets.paths << Rails.root.join("vendor", "assets", "javascripts").to_s
(.to_s because it returns an object while I want a string in here).
I cant find the solution and is driving me mad, because stylesheets directory in vendor works, but javascripts is not.
How can i do this?
Error returned:
<h1>Routing Error</h1>
<p><pre>No route matches [GET] "/assets/ext-all-debug.js"</pre></p>

I believe vendor is already included in your assets path, check using the rails console
rails console
Rails.application.config.assets.paths.each do |path|; puts path; end
However the easiest thing might be this
put ext at app/assets/javascripts/lib
require_tree will load it already or be explicit
application.js
//= require ./lib/ext-all-debug.js
If you really want it in vendor
create dir vendor/assets/javascripts/ext
create manifest file vendor/assets/javascripts/ext/index.js
put ext-all-debug.js into vendor/assets/javascripts/ext/
code for index.js
//= require ./ext-all-debug.js
code for application.js
//= require ext
that is the name of the dir that the index manifest file is located
Restart your rails server
if you don't want to load extjs via application.js, i.e. you want to include the extjs lib only on specific pages
<%= javascript_include_tag "ext" %>

You can add:
//= require_tree ../../../vendor/assets/javascripts
to your application.js file.

READ THE UPDATE
It looks like the problem is connected to the fact that EXT has it's own structure path build with relative paths.
I solved the problem by preserving the whole ext directory structure as is (without splitting images anywhere) and I added it to a vendor/externals directory (created by me). I then added the path with:
config.assets.paths << Rails.root.join("vendor", "assets", "externals").to_s
And now everything it's working fine by referencing it with //= require ext-all-debug.js
Update 23/12/2013:
As of Rails 3, notice that this directory has been added by default.

It's not easy to see the problem from the information you've provided as I think that the problem is elsewhere.
The purporse of asset pipeline is to to put all javascripts into one file. And that file is included to the HTML document. So the key is that one big JS file. Well, it can be more complicated but I think that's not necessarily your case.
So for example in your layout ERB (typically app/views/layout/application.erb):
<head>
...
<%= javascript_include_tag "application" %>
</head>
and in app/assets/javascripts/application.js:
//= require ext_all_debug
//= ...
When HTML page is requested, it asks for "application.js" and it is generated in a way that your vendor JS code is embedded into this file (notice that there is no path in that require).
And one last thing - it's quite important to test the behaviour in production environment because typically those generated JS files will be served by nginx/apache. rake assets:precompile is a good start.

Related

Rails error with asset pipeline "Asset filtered out and will not be served"

I am constantly getting this error
Asset filtered out and will not be served: 'Rails.application.config.assets.precompile..."
and so on for both
<%= stylesheet_link_tag "login" %>
<%= javascript_include_tag "login" %>
I've searched on stackoverflow and read things to find out that I can simply just add the files into the precompiled list as the error says, but I don't know why I have to add this is when I already have the manifest file with
//= require_tree .
I've seen ruby applications where manifest files take care of the job. What's happening?
You're confused about what the manifest does.
//= require_tree . only merges those files into a single large file, whatever file the manifest is in. (Presumably application.js; the whole point being that Sprockets generates a single file that users can cache, instead of needing to load multiple.) It doesn't keep them around as separate files--for that you need to insert them in your assets.rb, as suggested.
add login.css and login.js into your config/initializers/assets.rb
more information is described under Precompiling Assets Guide

Serve Javascript file without timestamp and separate from application.js

I would like to serve a specific js file in production (heroku) without timestamp.
I am able to serve the file separately, but it is served with timestamp which I don't want. The reason is I want this file get accessed by other sites.
Here are the codes:
application.html.erb
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= javascript_include_tag 'ca4me', 'data-turbolinks-track' => true, :cache => false %>
application.js
// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or vendor/assets/javascripts of plugins, if any, can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file.
//
// Read Sprockets README (https://github.com/sstephenson/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery_ujs
//= require turbolinks
//= require bootstrap-slider
//= require bootstrap.min
application.rb
config.assets.precompile += %w( ca4me.js )
HTML source in production environment:
<script data-turbolinks-track="true" src="/assets/application-b83af88604eb0fb1867384db77b826ae.js"></script>
<script cache="false" data-turbolinks-track="true" src="/assets/ca4me-fcff49d8b1799052a3f84c913160f6b2.js"></script>
So is there away I can serve ca4me.js without the timestamp?
File
The reason is I want this file get accessed by other sites.
We did this:
/public/your_js_file.js
This is a pain to keep updated, but means your app will always have the file available at /____.js. Indeed, when you use asset precompilation, the assets are deployed to folders in the public directory like this:
- public
|-stylesheets
|-javascripts
|-images
If you're looking to keep a file available for other sites (like a widget or something), I would personally keep the code base separate from your Rails app, using Grunt or similar (saving the file to rails_app/public directly.
Digest
I wanted to learn about this, and I found this:
config.assets.digest_exclusions << /fontawesome/
The only problem is this is for the digestion gem - meaning it won't be available in Rails 4. I am still trying to find information regarding how to accomplish this in Rails 4, and I would recommend looking at my solution above for now
--
Personally, I would rely on the asset pipeline for my assets, and keep a file in public if I wanted a static location for people to access. The likelihood is that file (library?) will be updated in conjunction, albeit exclusively, with the Rails app; meaning you may wish to keep the code bases separate

Rails Asset Pipeline loads all files

I have multiple files in my app/assets/javscripts folder, application.js.erb, page.js.erb, sections.js.erb & scraped.js.erb.
Rails loads them all in my layout with <%= javascript_include_tag "application" %> in application.html.erb layout. Which is called from the PagesController.
I do not want scraped.js.erb to be loaded at all & sections.js.erb I would like to only be loaded from the SectionsController.
From my understanding (after reading http://guides.rubyonrails.org/asset_pipeline.html) that's how the asset pipeline worked. That if called from the PagesController it would load application.js.erb & page.js.erb but obviously that's not the case.
Am I doing something wrong? Could someone explain to me how the asset pipeline works? And how I can only use select assets rather than all of them?
Check your manifest file, in assets/javascript you got the file application.js, it contains
//= require_tree . which include during compilation all files of the directory tree.
If you want to exclude some files you can either require your files one by one: // require my_file, either create sub directories in your javascript directory and use
//= require_directory my_directory
Read more http://guides.rubyonrails.org/asset_pipeline.html

when do I need to add an asset to config.assets.precompile and when not?

I'm a little confused by when I need to add an asset to config.assets.precompile and when it's not necessary.
(It's possible that my problem may stem from the fact that this app was migrated from rails 2.x; at some point soon I'm going to rebuild it from the ground up as a 3.x app, but don't have the time for that yet.)
Here's my issue: I have a .css and .js files that are not being found by sprockets unless I add them to config.assets.precompile in application.rb. I can't imagine I have to do this for every .js and .css, do I?
For example, one file I'm having this issue with is app/assets/stylesheets/facybox.css.
application.css is:
/*
*= require_self
*= require_directory .
*/
(yes, require_directory instead of require_tree intentionally).
I run rake assets:precompile on my server during deploy. The resulting application.css has the contents of facybox.css in it.
facybox.css is referred to in a partial, like this:
<% content_for :header do %>
<%= stylesheet_link_tag "facybox" %>
<% end %>
But when I go to a page that includes the partial, I get:
Sprockets::Helpers::RailsHelper::AssetPaths::AssetNotPrecompiledError in Admin#compositions
Showing /srv/zmx/releases/5420c4dde6fbec53d78cffe78396085f263ed039/app/views/shared/_preview_assets.erb where line #6 raised:
facybox.css isn't precompiled
which I assume is because sprockets is looking for the fingerprinted copy of the file, which doesn't exist unless I add it to config.assets.precompile. Then all is hunky-dory.
Can someone explain?
The rules for precompiling are simple:
If an asset is required in one of the application manifests you do not need to add it to precompile.
If an asset needs to be referenced directly in a Rails view then you DO need to add it (and you should remove it from any manifests).
As you said yourself, the contents of facybox.css are already included in your application.css.
This means that you can just remove the stylesheet_link_tag from your partial and also any other places where you use facybox.css. You would have to do the same for all other stylesheets that you already have included in your application.css

Where to put Galleria (jQuery image gallery framework) in Rails 3.1 Asset Pipeline?

I'm a bit confused as to where to put a jQuery framework like Galleria in Rails 3.1's new Asset Pipeline?
I know it, technically, should go into /vendors/assets/javascripts but, it is my understanding that, the Galleria folder with the jQuery & themes wants to be in root (/galleria) of the live site in order to work correctly.
Also, while we're at it, where to put the following script so it will appear only on the page(s) with a gallery?
<script>
$('#gallery').galleria({
width:500,
height:500
});
</script>
Edit: Surprised there's no response!?! Maybe Galleria isn't that popular? These are the files I'm trying to load. They are bundled like this though I could easily move them:
vendor/
assets/
javascripts/
galleria-1.2.5.js
galleria-1.2.5.min.js
galleria/
themes/
classic/
classic-loader.gif
classic-map.png
galleria.classic.css
galleria.classic.js
galleria.classic.min.js
i thought Sprockets require_tree . would load everything in app/assets, lib/assets and vendor/assets?!?
I had the same problem, and it took a while to get working. Initially, it would work fine on development, but when we moved to production, Galleria silently failed, due to the asset filenames now having "fingerprints". This also seems to be an issue with jQuery UI themes, and many other such scripts.
Of course, you could just go back to the old way of doing things and throw everything in "public", but we would like the advantage of automatically merging all css/js files, and doing things the rails way.
This is how I got it working:
vendor/
assets/
images/
classic-loader.gif
classic-map.gif
javascripts/
galleria-1.2.5.js
galleria.classic.js
stylesheets
galleria.classic.css.scss
Rename your galleria.classic.css file to galleria.classic.css.scss. Then replace the image references, like so (I had two):
url("classic-loader.gif") becomes image-url("classic-loader.gif")
UPDATE: It looks like you don't need to do this in Rails 3.1.1. Just rename the file to .css.scss and rails will automatically preprocess the url() calls for you.
In your app/assets/javascripts/application.js file, make sure you have the lines
//= require galleria-1.2.5
//= require galleria.classic
//= require_tree .
In you app/assets/stylesheets/application.css file, make sure you have the lines
*= require galleria.classic
*= require_tree .
Finally, Galleria seems to have some fancy non-standard css loading built in. This is what was preventing Galleria from loading on our production website. Since we have already included the stylesheet, we want to disable this behavior. Simply open up galleria.classic.js (or your Galleria theme javascript file), and replace the line:
css: 'galleria.classic.css',
with:
css: false,
This will tell Galleria not to try loading the stylesheet.
One more thing - when trying to compile these assets, I ran into what is apparently a bug in Rails 3.1.0. When I ran rake assets:precompile, I got errors like:
$ bundle exec rake assets:precompile
rake aborted!
classic-loader.gif isn't precompiled
(in /vendor/assets/stylesheets/galleria.classic.css.scss)
Long story short, you need to set this line in config/environments/production.rb:
config.assets.compile = true
This shouldn't be necessary once 3.1.1 is released.
I like Arjen's suggestion, though I think vendor/assets/libs is more appropriate. Here's my setup:
In config/application.rb
config.assets.enabled = true
config.assets.paths << "#{Rails.root}/vendor/assets/libs"
In app/assets/javascripts/application.js
//= require galleria/galleria-1.2.6.min.js
To initialize:
Galleria.loadTheme('assets/galleria/themes/classic/galleria.classic.min.js');
$('#gallery').galleria();
Notice how the path passed to loadTheme() begins with 'assets'.
I like this setup because it keeps the galleria folder intact. Also, it concatenates galleria-1.2.6.min.js onto my main js file (one less http request).
I've also stumbled upon this problem. Dividing up an existing library so it fits into the current javascripts/stylesheets structure is a bit of a hassle. Therefor you can add an extra path to your application.rb file to load assets from, like this:
# Enable the asset pipeline
config.assets.enabled = true
config.assets.paths << "#{Rails.root}/app/assets/libs"
Create a 'libs' folder under app/assets, copy the galleria library to this folder and add this to your application layout file:
<%= javascript_include_tag 'galleria/galleria-1.2.4.min.js' %>
<%= javascript_include_tag 'galleria/themes/classic/galleria.classic.min.js' %>
You could also bundle up the galleria code by requiring the js files, but that's up to you.

Resources