Well it's the first time I set up a Rails app from the beginning and I just created my first view.
When I run the server I get a 404 Not Found error when trying to load the application.js file.
Layout
<html>
<head>
<%= yield :head %>
</head>
<body>
<h1>If you're not and Admin you shouldn't be here!</h1>
<%= yield %>
<%= javascript_include_tag 'application' %>
<% yield :script %>
<script>
$(function(){
alert('Hey')
})
</script>
</body>
</html>
application.js
//= require jquery
environment/development.rb
...
config.assets.debug = false
config.assets.compile = false
config.assets.digest = true
...
And when I run on terminal rake assets:precompile I get this error:
rake aborted!
Don't know how to build task 'assets:precompile'
What is causing this?
To resolve this, add the following to config/application.rb:
require 'sprockets/railtie'
For more information see here.
Try to set config.assets.compile = true and try again. It should work after that.
Cheers!
After running rake assets:precompile --tasks the precompile task was not listed.
I found out that a require on config/application.rb was missing:
require 'rails/all'
After adding this the app started precompiling and serving assets (actually there were minor errors with the gems I tried to install, I just had to remove the configuration files and then everything worked fine)
Related
Ok so compiling my assets is working fine but when I run:
thin start -e production
none of my javascript or css is loading. My browser is also cancelling the requests to get my assets. I'm not sure why this is but I suspect its because it thinks its 404'ing on them. If you look at the top image you'll see that my application.css file was compiled and stored in my assets folder but when I try to access the file, I'm getting my 404.html file.
What gives!?
Edit:
I was asked to post my view. Here is some of the code in the project:
<% content_for :title, 'Quick Quote' %>
<% content_for :subtotal, get_subtotal %>
<% content_for :stylesheet_includes do %>
<%= stylesheet_link_tag "quote", "jquery-ui-timepicker-addon" %>
<% end %>
<% if #quote.errors.any? %>
<div class="flash alert">
<% #quote.errors.full_messages.each do |msg| %>
<div><%= msg %></div>
<% end %>
</div>
<% end %>
<h1>Quick Quote</h1>
my layout:
<!DOCTYPE html>
<html>
<head>
<title><%= (yield(:title) + " - " unless yield(:title).blank?).to_s + "Online Scheduler Order Taker" %></title>
<%= stylesheet_link_tag "application", "jquery-ui-timepicker-addon.css", :media => "all" %>
<%= yield :stylesheet_includes %>
<%= javascript_include_tag "application" %>
<%= yield :javascript_includes %>
<%= csrf_meta_tags %>
</head>
<body>
code in my production.rb
config.assets.precompile += %w( quote.css jquery-ui-timepicker-addon.css prices.css contact.css )
Top of my application.css.scss.erb:
/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
*
* You're free to add application-wide styles to this file and they'll appear at the top of the
* compiled file, but it's generally better to create a new file per style scope.
*
*= require_self
*
* require_tree . <- commented out
* require jquery-ui-timepicker-addon.css <- commented out
*/
my entire application.js file
// 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
// the compiled file.
//
// WARNING: THE FIRST BLANK LINE MARKS THE END OF WHAT'S TO BE PROCESSED, ANY BLANK LINE SHOULD
// GO AFTER THE REQUIRES BELOW.
//
//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require jquery-ui-timepicker-addon.js
//= require_tree .
Check your config/environments/production.rb file and add next line to it (if it does not have it yet):
config.serve_static_assets = true
Rails recommends that this setting config.serve_static_assets by default should be disabled i.e. set to false. Here is the default configuration in config/environments/production.rb generated in rails app
Disable Rails's static asset server (Apache or nginx will already do this)
config.serve_static_assets = false
So if you are setting it to true in your local app then that's still fine. But if you are deploying your app on Apache or ngix or anything other than heroku then its not advisable to make config.serve_static_assets=true in your production.rb config file. Here is the documentation in Rails guides.
config.serve_static_files configures Rails itself to serve static
files. Defaults to true, but in the production environment is turned
off as the server software (e.g. NGINX or Apache) used to run the
application should serve static assets instead. Unlike the default
setting set this to true when running (absolutely not recommended!) or
testing your app in production mode using WEBrick. Otherwise you won't
be able use page caching and requests for files that exist regularly
under the public directory will anyway hit your Rails app.
URL - http://guides.rubyonrails.org/configuring.html
Rails 5:
Change config.public_file_server.enabled in production.rb to true or add RAILS_SERVE_STATIC_FILES with any value to env variables.
Reference: https://github.com/rails/rails/pull/18100
Can you put this line in your current environment.rb?
config.serve_static_assets=true
Reference: here
i have a rails application that i want to deploy on my production server,
the thing is that when i run rake assets:precompile, it generates css and js files under /public/assets , for example "/public/assets/application.css" and "/public/assets/application.js"
but when i add this tags on my erb
<%= stylesheet_link_tag "application", :media => "all" %>
<%= javascript_include_tag "application" %>
and i run the site, they both refer to
"mysyte/javascript/application.js"
and
"mysite/stylesheets/application.css"
so, the question is, how do i configure the app so that when i precompile my assets they are place inside "/public/javascript", "/public/stylesheets", and "/public/images"
thanks in advance.
EDIT:
i guess the real problem is that on production the following tag
<%= stylesheet_link_tag "application", :media => "all" %>
is refering to "www.mydomain.com/javascript/application.js"
how do i change it to refer to
"www.mydomain.com/assets/application.js"
i've solved this,
the thing is that i'm using mongoid on my app, and had to remove active_record
so in my application.rb
i removed require "rails/all"
and in change i added
require "action_controller/railtie"
require "action_mailer/railtie"
require "active_resource/railtie"
require "rails/test_unit/railtie"
i was missing
require "sprockets/railtie"
now my app is searching for assets in the right assets folder.
thanks richlewis and deefour for your time.
I have the following in config/environments/test.rb:
config.assets.debug = true
config.assets.enabled = true
I get all my js files concatenated into application.js
However, when I do the same in development, I get javascript file included by itself.
Is there a way to make test (I'm using cucumber) behave like development?
The reason I'm asking is because I would like to be able to modify javascript and run my cucumber tests right away instead of having to do rake assets:precompile RAILS_ENV=test every time.
Thanks!
I turns out I had a stupid hard coded line:
I had the following code and I suggest you never pass the :debug option to javascript_include_tag but instead, configure everything in your development.rb and test.rb.
<!-- watch out when passing the :debug option to javascript_include_tag -->
<%= javascript_include_tag "application", :debug => (Rails.env == "development") %>
in your application.rb file you may need to add test to the following line:
Bundler.require(*Rails.groups(:assets => %w(development test)))
I am reading the "agile web development with rails" book and ran into a problem at the end of chapter 6. Basically, what I have done so far is defined a sass stylesheet (products.css.scss) and linked it to my application in layouts/application.html.erb:
<!DOCTYPE html>
<html>
<head>
<title>Depot</title>
<%= stylesheet_link_tag "application", :media => "all" %>
<%= javascript_include_tag "application" %>
<%= csrf_meta_tags %>
</head>
<body class='<%= controller.controller_name %>'>
<%= yield %>
</body>
</html>
but it doesn't load when i run the server and visit the page!
any idea why?
This solved my problem:
bundle exec rake assets:precompile
i just spent an hour figuring out the answer, since been having the exact same issue myself. go to your application.css.sass and make sure it has
/* ...
*= require_self
*= require_tree .
*/
in it. this auto loads all the other .css.sass in apps/assets/stylesheets, then precompiles them into public/assets/stylesheets to be 1 statis css file, and that is being served to your browser.
Have you include that products.css.scss in the application.css manifest file that you are referencing in the layout?
With the asset pipeline enabled, you must include the manifest in the layout and reference all the stylesheets from the manifest.
Hope it helps.
Running the assets precompile command will compile as the user above mentioned... however, that might not be what you want to do unless you want to have to run that everytime you make a change and then add all of this to your SCM repo and then possibly have issues in production.
The real solution to this exact example is that the doesn't have the "products" class in it, so the products.css.scss isn't picked up. See this post which helped me understand this: https://stackoverflow.com/a/10080134
place the depot.css from /public/stylesheets/ to app/assets/stylesheets/
according to the documentation (http://apidock.com/rails/ActionView/Helpers/AssetTagHelper/StylesheetTagHelpers/stylesheet_link_tag) you can set the tag to include all stylesheets in the stylesheets directory with stylesheet_link_tag :all There are also options for caching, recursion, and concatenation.
If you don't want to include everything but just the application.css and your controller's css you could do this:
= stylesheet_link_tag 'application', params[:controller].classify.downcase.pluralize
I've been following along Michael Hartl's excellent RoR Tutorial, but I'm using RoR 3.1. I am a newbie to RoR 3.1 and need help related to assets pipeline. Here is my problem:
Before continuing to section 5.3, I thought I'd like to push to Heroku and see how things develop. To my surprise "GET /" results in error 500. Everything went OK in my local-development-environment. I then tried running my local sample_app under production-environment (rails s -e production). Same result, error 500:
Sprockets::Helpers::RailsHelper::AssetPaths::AssetNotPrecompiledError in Pages#home
Showing /Users/john/Projects/sample_app/app/views/layouts/_stylesheets.html.erb where line #4 raised:
blueprint/screen.css isn't precompiled
Supporting info:
I put blueprint CSS directory under vendor/assets/stylesheets.
I followed Michael's section 13.1.4 advice and have the following as my app/views/layouts/application.html.erb:
<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<%= render 'layouts/stylesheets' %>
<%= stylesheet_link_tag "application" %>
<%= javascript_include_tag "application" %>
<%= csrf_meta_tags %>
</head>
<body>
<div class="container">
<%= render 'layouts/header' %>
<section class="round">
<%= yield %>
</section>
<%= render 'layouts/footer' %>
</div>
</body>
</html>
Content of app/views/layouts/_stylesheets.html.erb:
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<%= stylesheet_link_tag 'blueprint/screen', :media => 'screen' %>
<%= stylesheet_link_tag 'blueprint/print', :media => 'print' %>
<!--[if lt IE 8]><%= stylesheet_link_tag 'blueprint/ie' %><![endif]-->
I have run bundle exec rake assets:precompile.
Content of public/assets/manifest.yml:
---
logo.png: logo-8e0a5ad292fbb13a2b07e68fa3995406.png
rails.png: rails-bd9ad5a560b5a3a7be0808c5cd76a798.png
blueprint/plugins/buttons/icons/cross.png: blueprint/plugins/buttons/icons/cross-2ebcd25368006d1b7b0c5b7d6b523ab3.png
blueprint/plugins/buttons/icons/key.png: blueprint/plugins/buttons/icons/key-55237526967cbcab3e8cfb12f0029d88.png
blueprint/plugins/buttons/icons/tick.png: blueprint/plugins/buttons/icons/tick-3f5fc1f52b505b93f88263e0432d25ce.png
blueprint/plugins/buttons/readme.txt: blueprint/plugins/buttons/readme-3ff7f5dbb0288d71f70682fdbe9d86ec.txt
blueprint/plugins/fancy-type/readme.txt: blueprint/plugins/fancy-type/readme-e7ed185d1a9f23256d418ab929b464d9.txt
blueprint/plugins/link-icons/icons/doc.png: blueprint/plugins/link-icons/icons/doc-b071fd74b88ff38cda8360a53f493013.png
blueprint/plugins/link-icons/icons/email.png: blueprint/plugins/link-icons/icons/email-28104e72b3418737d4b9b329c12ec358.png
blueprint/plugins/link-icons/icons/external.png: blueprint/plugins/link-icons/icons/external-ee6d976ddb80125fafe1a33c6f8aed10.png
blueprint/plugins/link-icons/icons/feed.png: blueprint/plugins/link-icons/icons/feed-59bc8604661681639d25cb7015a32c38.png
blueprint/plugins/link-icons/icons/im.png: blueprint/plugins/link-icons/icons/im-afeeb6e0b652c1edb1441bf0fb428596.png
blueprint/plugins/link-icons/icons/lock.png: blueprint/plugins/link-icons/icons/lock-d73c4b3b57ce72cb6dbd8b265507ff75.png
blueprint/plugins/link-icons/icons/pdf.png: blueprint/plugins/link-icons/icons/pdf-c4c543e5103a8516839a7846b91e1ac4.png
blueprint/plugins/link-icons/icons/visited.png: blueprint/plugins/link-icons/icons/visited-fb2370448bc4ea5d079e963a8c0d900b.png
blueprint/plugins/link-icons/icons/xls.png: blueprint/plugins/link-icons/icons/xls-5399729cd31dffc492a04b3805cd0be1.png
blueprint/plugins/link-icons/readme.txt: blueprint/plugins/link-icons/readme-42c02030199cd36a671d4b623cb4dc36.txt
blueprint/plugins/rtl/readme.txt: blueprint/plugins/rtl/readme-8d11bf76e19fb3fc7dbc6c2ddb54b92d.txt
blueprint/src/grid.png: blueprint/src/grid-973add038ed86febca85f03e8b35b94a.png
jquery-ui.min.js: jquery-ui-7e33882a28fc84ad0e0e47e46cbf901c.min.js
jquery.min.js: jquery-8a50feed8d29566738ad005e19fe1c2d.min.js
application.js: application-a552e1db33b8be6a42eedf1261916f3c.js
application.css: application-214e0c0742f20b334e8a7776e0a4c71d.css
I don't see blueprint/screen.css in manifest.yml.
What am I missing?
From http://guides.rubyonrails.org/asset_pipeline.html#precompiling-assets
If you have other manifests or individual stylesheets and JavaScript files to include, you can add them to the precompile array
This means that in your config/environments/production.rb, you set
config.assets.precompile += %w( blueprint/screen.css blueprint/print.css )
or a catchall:
config.assets.precompile += %w( *.css *.js )
I added a reference to the blueprint stylesheets in my application.css file. This way, I do not have to change the layout to modify the stylesheets, I simply need to modify the application.css file, run rake assets:precompile, and restart the webserver (if webrick or similar).
My application.css currently looks like this:
/*
* This is a manifest file that'll automatically include all the stylesheets available in this directory
* and any sub-directories. You're free to add application-wide styles to this file and they'll appear at
* the top of the compiled file, but it's generally better to create a new file per style scope.
*= require_self
*= require_tree ./blueprint
*= require_tree .
*/
You may want to precompile your assets on production as described above.
And if you use capistrano you may do it after code update:
require 'bundler/capistrano'
after 'deploy:update_code' do
run "cd #{release_path}; RAILS_ENV=#{rails_env} bundle exec rake assets:precompile"
end
From my own experience with this problem, where I was also going through the excellent RoR tutorial by Michael Hartl, there was one step that I think might be left out at this point...
bundle exec rake assets:precompile
git add public/assets
git commit -m "vendor compiled assets"
git push heroku
I found this here.