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
Related
I'm trying to deploy my first Rails application, but I'm getting 404 Not found for all assets (.css, .js files and images). I tried many ways of getting things work, but nothing worked. All of the asset paths look like this:
/stylesheets/application.css
My production.rb file: http://pastebin.com/SeVNEZD9
My application.html.erb, where I include these assets look like this: http://pastebin.com/gHkpfA8Z
Thanks forward for any help.
In config/environments/production.rb file add
config.assets.digest = true
Then stylesheet_link_tag will generate fingerprints url.
You need to precompile your assets for this by running this command on terminal.
RAILS_ENV=production bundle exec rake assets:precompile
After deployment you should do
RAILS_ENV=production bundle exec rake assets:precompile
Since this is your first Rails app, let me explain where your problem might be:
When you create your assets, they reside in the asset pipeline. This
is a folder located at /app/assets where your asset files will be
stored
If you want to use assets in production, there are two ways to do it -
the first is to use the assets dynamically, or to use them as static
(which is where you precompile). When you use the likes of Heroku etc,
you need to use static assets, which is why they precompile them for
you when you deploy
The problem with static assets is that Rails creates fingerprints
for them. These fingerprints basically give them a unique identifier
which you have to dynamically reference using <%= asset_path %> etc
Your problem is likely caused by you not accessing the precompiled assets correctly. The way to fix this is to use asset tag helpers like this:
#app/views/layouts/application.html.erb
<%= stylesheet_link_tag "application" %>
<%= javascriot_include_tag "application" %>
It looks like it's working now. I needed to restart the server to apply the changes. Can anybody tell me why is it that I have to restart the server to apply such changes? I want to avoid it in the future.
I'm posting my production.rb file for those who face similar problems: http://pastebin.com/7Uskvcuc
I'm starting in rails and I've got an application that is working in dev (webrick).
The problem is: the precompiled CSS file is not found in production.
Now I host it on heroku and deploy it. I have a message saying that assets are precompiled (so it's not a compilation error) and everything is by-default for settings.
I've ls the /public/assets folder and everything is in there. I can even cat the application-*.css file and I get the full content I should have.
Now when I try to access the CSS file it gives me an error 404 (even tho it's an auto-generated css link usingĀ <%= stylesheet_link_tag "application", :media => "all" %>). So definetly it's not a problem that I did hardcode the CSS link.
I'm not exactly sure on what would be the next check to perform.
If you're curious on the output, it is currently publicly accessible here.
Try changing the configuration option config.serve_static_assets = false to config.serve_static_assets = true in your config/environments/production.rb if you haven't already done that.
The only thing that fixed it for me in Rails 4 was
config.assets.compile = true
in config/environments/production.rb
This would fall back to the assets pipeline if a precompiled asset is missed, according to the documentation.
So I started investigating the asset pipeline in Rails3 and I have a desired use case that is somewhat off the beaten path... so I'm looking for a recipe.
I often run webrick locally for development and then run
Passenger+Apache for deployed instances of the app.
the app is configured with a suburi path, e.g. http:// server/approot/...
to make webrick paths work like deployed instances, I added map '/approot' do run app to config.ru. Now webrick is also at http:// local:3000/approot/...
The Confusion
Given this setup, I tried to use rake assets:precompile and have been having a lot of configuration problems between local, deployed -- missing files, incorrect paths, 404s in firebug, etc. Here's a smattering of solutions I've tried:
config.assets.initialize_on_precompile = false to application.rb to prevent trying to initialize the app for production, (we have several deployed environments and call them different names, ug.) when precompiling the assets.
config.assets.precompile += %w( *.js *.css ) to application.rb to include things like jquery.js and ujs and rails.js that were missing.
config.assets.prefix = "/approot/assets" to correct a problem where the map above (in config.ru) doesn't apply to assets, so assets had to be precompiled to ./public/approot/assets, but I'm not sure if that only works locally, i.e. if I deploy, will my asset paths be http:// server/approot/approot/(js|css|...)?
When precompiling assets, the rake task switches to env production, but then it is unclear from the Rails3 doc whether sprockets continues to compile on the fly locally and use those dynamic assets, or whether it will serve the static precompiled assets instead?
I tried putting config.serve_static_assets = true in environments/development.rb, but I'm not sure how this works with config.assets.compress = false and config.assets.debug = true. Setting the assets.debug to false just seems to hide the GET requests in the webrick log, although I saw a post saying that "solved the problem" [sic].
Requirments for a Recipe
So I'd like a recipe that does the following:
assets are consistently and correctly served from a path http://server/approot/assets/... whether run in passenger or webrick (i.e. deployed or local). If this isn't possible, then I can switch my local dev environment to use Passenger+Apache as well, it's not a big deal, but I just want to know if it's possible.
raw assets exist in /app/assets like normal Rails3, but when I precompile them, they work exactly the same way in deployed envs so that asset file references don't break (i.e. right now, there are a lot of refs looking for /assets/image/... when the path is clearly set up as /approot/assets/image.... (It's unclear from the Rails3 doc whether there are assumptions about deploying to root vs a suburi, e.g. http:// server/assets/... vs. http:// server/approot/assets/...)
sprockets can't be used in deployed environments (our restriction, sorry). So this means the rails3 app has to effectively look like a static asset app. I know this is what precompiled assets are supposed to do, but the pathing issues are preventing me from getting this working as advertised.
TL;DR - I feel like I'm trying a lot of separate things that might work if I only knew the right combination of them.
References
http://guides.rubyonrails.org/asset_pipeline.html#precompiling-assets
http://blog.55minutes.com/2012/02/untangling-the-rails-asset-pipeline-part-2-production/
http://blog.55minutes.com/2012/02/untangling-the-rails-asset-pipeline-part-3-configuration/
https://github.com/rails/rails/pull/3946
Ok, here's a potentially horrible answer, but it seems to work with webrick in two contexts now and it's the day after Halloween (although I haven't tried this approach in deployed slots yet).
Configuration
Unless otherwise mentioned, everything is defaults from a rails new app generation.
config/application.rb
config.assets.initialize_on_precompile = false
environments/production.rb (not really production, only used for rake asset:precompile)
config.assets.css_compressor = :yui
config.assets.js_compressor = :uglifier
environments/stage.rb (this is one of our deployed envs)
config.serve_static_assets = true
config.ru
This is the horrible part. I duplicated the map so that Rack would serve both the suburi and the root. So the controller action that shows the layout can have http:// server/approot/foo/index, while the assets within the layout can be loaded from http:// server/assets/...
map '/approot' do
run AppRoot::Application
end
map '/' do
run AppRoot::Application
end
Running it locally
$ rake assets:precompile
$ rails s
and in firebug I see the separate parts served by sprockets (all 200 OK):
GET /approot/
GET /assets/application.css?body=1
GET /assets/jquery.js?body=1
GET /assets/jquery.ujs.js?body=1
GET /assets/application.js?body=1
Ok, so now test a 'deployed' slot locally and see if the compiled assets work?
$ rails s -e stage
and then I see the correct precompiled assets (all 200 OK):
GET /approot/
GET /assets/application-xxxxxxxxxxxxxxx.css
GET /assets/application-xxxxxxxxxxxxxxx.js
Ok, so this isn't as nice as a real suburi solution and I think I'm going to have problems in deployed slots. Round 2, fight!
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.
I have a JS file defined in the app - app/assets/javascripts/client/some-client.js.coffee
In my dev env I can access this file via URL - /assets/client/some-client.js
But I cannot do the same in production? ...meaning the URL does not work, what could be wrong?
In prod, you will have access only to precompiled files, if you use the default configuration.
You can define which assets to precompile in config/environments/production.rb:
config.assets.precompile += %w( some-client.js blabla.js some-client.css ) #etc...
Run rake assets:precompile to... precompile your assets.
Learn more with this guide: http://guides.rubyonrails.org/asset_pipeline.html
If you didn't find it yet, be sure that you are accessing it through <%= javascript_include_tag "some-client" %>. As the asset pipeline handles finding where it has precompiled the asset. Along with the config.assets.precomile += %( some-client.js ). Also, if the helper function can't find that in production you might want to try moving client/ to assets/javascript/client I think it looks for assets for example javascripts files in app/assets/javascripts/ lib/assets/javascripts/ and vendor/assets/javascripts/ if I understand the asset pipeline. And it looks like you don't have it in any of those files, so it may be skipping it since it doesn't see it.
EDIT:
Looks like you have it in javascripts/ sorry. The asset pipeline should traverse subdirectories.