Rails stylesheets placed in assets don't show on website - ruby-on-rails

I have a set of custom stylesheets in assets/stylesheets/xxx folder.
I have a custom application_xxx.css.scss file in assets/ that requires all of those.
I have a custom layout xxx_application.html.haml which includes:
= stylesheet_link_tag 'application_xxx'
Everything works nicely in development, when I push everything now to the testing server none of the stylesheets are working. it gives a msg "Failed to load resource application_xxx.css "
Do I have to place my custom folder and custom application file in the public directory instead?

Have you precompiled assets?
bundle exec rake assets:precompile
You don't need to manually move any any custom css or js. Precompile your assets then try pushing again.
My production.rb file has these relevant lines:
config.assets.precompile += %w( application-all.css application-print.css )
config.assets.compile = false
config.serve_static_assets = false

Related

Rails asset pipeline, CSS file I added (but not required) is not precompiling

I added a file named mobile.css into my assets/stylesheets directory. This file is not required in application.css as I only explicitly add it by pages I want optimized for mobile. When I run rake assets:precompile it doesn't push it into the asset pipeline. I'm going to guess if I add it to application.css it'll precompile, but then my mobile stylesheet will override the default stylesheet which I do not want.
Works great in development mode with the following in my layout:
- if mobile_device?
= stylesheet_link_tag "mobile"
In production this is a no go as mobile.css is not getting added to the pipeline.
What's the best way to handle this?
You can always add it manually to the precompile array in your application.rb.
config.assets.precompile += %w( mobile.css )
Rule of thumb as far as the asset pipeline is concerned: if it's not required in a manifest OR it's not in the precompile array, it's not going to be precompiled.

dynamic asset loading heroku

I'm implementing a site tour feature for the website https://looky.co, and I want to only send the site_tour.js file when a show_site_tour is set to true. (show_site_tour is a database column).
I have it set up in my application.html.haml (layout file). The problem is with the way heroku runs the asset pipeline.
Directory structure
\ app
\ assets
\ javascripts
\ guiders
site_tour.js
Basically the problem is that when I try to include that folder only on the condition that the database column is equal to true, heroku gives an "asset not precompiled" error.
In my application.html.haml
%head
= javascript_include_tag 'application'
- if current_user.show_site_tour == true
= javascript_include_tag 'guiders/site_tour'
So how can I make this work with the heroku pipeline?
Basically the main question is, how can I have more than one javascript file on heroku?
This answer should help.
Basically, you need to tell the asset pipeline to keep the site_tour file separate.
config.assets.precompile += %w( guiders/site_tour )
You should end up with two JavaScript files after this setting takes affect, application.js and site_tour.js.
You can test this locally by precompiling the assets using rake.
bundle exec rake assets:precompile
This will show you how the output will end up on Heroku.
It's probably also worth noting that Heroku requires that you have the following setting set to false.
config.assets.initialize_on_precompile = false

rake assets:precompile for specific JS file

Could I run rake assets:precompile for specific JavaScript file?
Otherwise the full precompile lasts for 5 minutes and makes quick changes in JavaScript files very annoying.
If you wanted to precompile just one file, you could make a custom rake task to do so fairly easy.
namespace :assets do
desc "compile one js file"
task :compile_one_file => :environment do
dest = "#{Rails.root}/vendor/assets/javascripts/compiled/"
js_asset = "your_jsfile.js"
File.write(dest + js_asset, Uglifier.compile(Rails.application.assets.find_asset(js_asset).to_s))
end
end
then from the command line
rake assets:compile_one_file
Hope this helps, I find this useful for vendor js files that I don't change often such as jquery and jquery plugins. That way when im in development it speeds up my page loads keeping the asset pipeline from having to route all the separate requests for my vendor files. It just serves up one minified js file of all my vendor js.
Short: You can't.
During precompilation Rails goes through the Application.js file and merges all imports into one so just changing one file is simply not possible due to the compression that goes on in there. (It doesn't do anything to files not referenced from application.js)
Next up: You should not have to run rake assets:precompile during development when doing quick fixes. Only on deployment where (depending on your patience) it should be no problem having the task run 5 minutes.
You should be using the development environment during development where asset precompilation is not necessary because Rails will serve the assets unmerged and un-minified.
If you are running the Rails build in web-server through rails s this should be by default, but you can explicitly start the rails server using:
rails s RAILS_ENV=development
If the assets are still not correctly displayed or you see errors make sure you have config.assets.debug = true
#Tigraine is partially correct. Rails 3.1+ assets are intended to be fully managed by Rails and by default all assets will be compiled down to one js and one css asset.
HOWEVER...
Compiling down to a single asset relies on the use of an asset manifest (application.js and application.css) that is processed by the Sprockets gem. By default these manifests include a require_tree directive and it's that directive that includes all the files. If you remove that directive, you've got to do a bit more work to get your assets compiled.
If you want to build separate assets you can set a config option in application.rb.
config.assets.precompile += %w( additional/asset.css funky/stuff.js )
The above line would add the files additional/asset.css and funky/stuff.js to the list of files that would be produced when the assets are precompiled (Note that the '+=' is being used to extend the default list). To be as explicit as possible this means that you would have four assets precompiled: application.js, funky/stuff.js, application.css, and additional/asset.css.
That said, you might want to check out the guard-rails-assets gem. The gem is flexible in the way it supports precompiling; precompiling only changed assets is possible. I've heard some good feedback about it but not used it myself.
#Tigraine isn't correct.
It's possible, you just have to create folders and put the css files in them and import it to different files in the assets folder.
Like
application.css
*= require_self
*= require foundation_and_overrides
*= require reset
*= require_tree ./screen
Where Screen is a folder I've placed inside the stylesheet folder. like assets/stylesheets/screen/. I call the application.css with
<%= stylesheet_link_tag "application", media: "screen, projection" %>
Now, if you want to create a single css file for another layout you create that under assets/stylesheets
Like xxx.css
If you need multiple files for xxx you follow the same steps as above but the important part here is that you add this line to
production.rb
config.assets.precompile += %w( xxx.css )
Then inside the layout you add:
<%= stylesheet_link_tag "xxx", media: "screen, projection" %>
You can do this completely without Rails. This can make things run faster depending on your environment.
quick_compile.rb
require 'sprockets'
sprocket = Sprockets::Environment.new
sprocket.js_compressor = :uglifier # or read off config yml
sprocket.append_path('app/assets/javascripts') # the directory that holds you js src.
file = File.new('test_min.js','w+') # the output file path.
file.puts(sprocket.find_asset('test.js')) # the file to complie
file.close
If you just want to evalute the //= require statement, you can remove the js_compressor setting. Sprocket will concatenate the files required.

What is auto generating the assets folder in development environment?

I am using rails 3.2.6 and my development.rb file has
# Do not compress assets
config.assets.compress = false
# Expands the lines which load the assets
config.assets.debug = true
and for some reason evertime i look in my public folder I have an assets folder that keeps appearing....I keep deleting it but it keeps reappearing ....is there a way to stop this
The main problem is the assets are being declared twice, once in the assets folder and once in the public folder which is an exact duplicate...this is messing things up for me
in application.rb
config.assets.enabled = false
Solved....I was my guard file compiling the assets
I commented out
guard 'rails-assets' do
watch(%r{^app/assets/.+$})
watch('config/application.rb')
end
And all is well

Rails 3.1 precompilation error in production for SWF file

I have a few .swf files that are being added to a project via a git submodule. They live in /vendor/private/widget/
To get the .swf files into the asset pipeline I'm doing the following:
config.assets.paths << "#{Rails.root}/vendor/private/widget"
In development this works just fine, but in production I get the following error:
ActionView::Template::Error (widget.swf isn't precompiled):
After searching around StackOverflow, I've tried these two solutions, both of which did not work:
config.assets.precompile << '*.swf'
config.assets.compile = true
Try setting application.rb 's
config.assets.digest = true
to
config.assets.digest = false
for the precompile, and flip it back to true afterwards. I don't know why this works or what part of the url digest would be preventing the asset inclusion, but this has been the only way i've found to be able to generate my assets in production to include swf files.

Resources