I'm using bootstrap-sass-rails this issue and when I run my rails project in production mode I get 3x 404 errors:
GET http://localhost:3000/assets/twitter/bootstrap/glyphicons-halflings-regular.woff 404 (Not Found) assets/twitter/bootstrap/glyphicons-halflings-regular.woff:1
GET http://localhost:3000/assets/twitter/bootstrap/glyphicons-halflings-regular.ttf 404 (Not Found) assets/twitter/bootstrap/glyphicons-halflings-regular.ttf:1
GET http://localhost:3000/assets/twitter/bootstrap/glyphicons-halflings-regular.svg 404 (Not Found)
I used rake assets:precompile RAILS_ENV=production to generate static files with result :
I, [2013-11-07T16:52:25.269370 #12948] INFO -- : Writing myproject/public/assets/application-3517eb39b597107b3dbccbcbf4f0b3cc.js
I, [2013-11-07T16:52:25.315358 #12948] INFO -- : Writing myproject/public/assets/application-1459bfe79a6477170658d53257e4a8fd.css
I, [2013-11-07T16:52:25.334356 #12948] INFO -- : Writing myproject/public/assets/twitter/bootstrap/glyphicons-halflings-regular-8b1bdc16b9e098d67afebbf8d59fcea7.eot
I, [2013-11-07T16:52:25.345360 #12948] INFO -- : Writing myproject/public/assets/twitter/bootstrap/glyphicons-halflings-regular-8d8305e5b6a807076d3ec68e2f190674.svg
I, [2013-11-07T16:52:25.357360 #12948] INFO -- : Writing myproject/public/assets/twitter/bootstrap/glyphicons-halflings-regular-946071b70245967633bb3a774c60f3a3.ttf
I, [2013-11-07T16:52:25.367360 #12948] INFO -- : Writing myproject/public/assets/twitter/bootstrap/glyphicons-halflings-regular-d7e2274ad1d940a0b2ce7480810ab223.woff
etc ...
All assets are working fine except these 3 font files. I searched all day long and didn't find anything. It seems rails is looking for the version without hash of these 3 files but rake generates them with hash
my config/production.rb :
config.cache_classes = true
config.eager_load = true
config.consider_all_requests_local = false
config.action_controller.perform_caching = true
config.serve_static_assets = true
config.assets.js_compressor = :uglifier
config.assets.compile = false
config.assets.digest = true
config.assets.version = '1.0'
config.log_level = :info
config.i18n.fallbacks = true
config.active_support.deprecation = :notify
EDIT
I tried to override the #font-face variable but it doesn't seem to remove old variables:
#font-face {
font-family: 'Glyphicons Halflings';
src: asset-url('twitter/bootstrap/glyphicons-halflings-regular.eot',font);
src: asset-url('twitter/bootstrap/glyphicons-halflings-regular.eot?#iefix',font) format('embedded-opentype'), asset-url('twitter/bootstrap/glyphicons-halflings-regular.woff',font) format('woff'), asset-url('twitter/bootstrap/glyphicons-halflings-regular.ttf',font) format('truetype'), asset-url('twitter/bootstrap/glyphicons-halflings-regular.svg#glyphicons-halflingsregular',font) format('svg');
}
I now have glyphicons loaded but still 3x 404 errors.
Ok then.
I switched to https://github.com/thomas-mcdonald/bootstrap-sass .
Pretty same bootstrap version and no problem with it.
EDIT UPDATE
bootstrap-sass has been updated. You need to make some changes as explained on github page if you still have 404 errors.
I had the same problem. It turned out that I had to add #import "bootstrap-sprockets" in addition to #import "bootstrap" inside application.css.sass.
ADD MIME TYPE into your webserver.
You have to define how to provide woff file.
for IIS, go to your IIS and open MINE type window
click ADD and type "woff" for first input box
and "application/x-font-woff" for second box
then repeat for other extensions
good luck
the font directory is not automatically seen as a asset directory. You need to add it explicitly by setting: config.assets.paths << Rails.root.join("app", "assets", "fonts") in the application.rb file.
Related
Whenever I change an included .scss file I cannot see the changes, even if I restart the server. I found that if I manually delete tmp/cache/* then restart the server, I can see the changes one time. Further changes are not shown (and the cache is back). I have tried rails server --no-dev-caching but it doesn't help. I have
config.assets.digest = false
config.assets.debug = false
config.assets.quiet = false
config.assets.raise_runtime_errors = true
config.action_controller.perform_caching = false
config.cache_store = :null_store
How can I see changes to my SCSS files when I reload the page in development? I test with curl http://localhost:3000/assets/application.css | less and search for the class that I changed and saved.
=> Booting Puma
=> Rails 5.0.7.2 application starting in development on http://localhost:3000
* Version 3.12.2 (ruby 2.4.3-p205), codename: Llamas in Pajamas
* Environment: development
Docs: https://guides.rubyonrails.org/v5.0/configuring.html#configuring-assets
I commented out Puma, used WebBrick with rails server --no-dev-caching, set config.assets.debug = true, loaded $ curl http://localhost:3000/assets/theme/theme.self.css | less, and the change was still not there.
I found the answer here! https://stackoverflow.com/a/59895954/148844
I had to change #import "theme-overrides.scss"; => #import "theme-overrides";, rename theme-overrides.scss => _theme-overrides.scss, change #import "theme_components/helpers.scss"; => #import "theme_components/helpers";, rename helpers.scss => _helpers.scss, and it all worked!
Now I have to rename 100 different files!
I'm running Rails 5.2.2. I recently separated some admin code from my frontend and in the process moved my controllers, views, css & JS to folders in either frontend or admin respectively.
In development, everything works fine. In production, I am unable to load image assets from my css.scss files using the following line background: url(arrow.png) no-repeat left center; (located in app/assets/stylesheets/frontend/application.css.scss).
My assets has the following file structure:
assets/
config/
images/
admin/
frontend/
products/
another_folder/
javascripts/
admin/
frontend/
stylesheets/
admin/
frontend/
I did not have to change any of my image tags in my views once I made these changes for my images in assets/images/products so I figured that I wouldn't have to do that anywhere else either; things just seemed to work. However, in production the arrow.png returns a 404. When I inspect the image request, the link to the image is /assets/frontend/arrow.png. I use the RAILS_ENV=production flag when compiling assets. I have also run rake assets:clobber with the production flag then tried compiling the assets again. I've deleted all browsing data.
Here are my server logs where the image is requested:
I, [2019-08-01T05:06:22.496953 #6733] INFO -- : [8a0b82c0-c4a3-419f-92fd-8f4a89bbe643] Started GET "/assets/frontend/arrow.png" for 35.188.197.210 at 2019-08-01 05:06:22 +0000
F, [2019-08-01T05:06:22.501395 #6733] FATAL -- : [8a0b82c0-c4a3-419f-92fd-8f4a89bbe643]
F, [2019-08-01T05:06:22.503739 #6733] FATAL -- : [8a0b82c0-c4a3-419f-92fd-8f4a89bbe643] ActionController::RoutingError (No route matches [GET] "/assets/frontend/arrow.png"):
UPDATE:
Adding this to a view works fine in production so I can confirm the asset does indeed compile properly.
<%= image_tag("frontend/arrow.png") %>
For Rails 5, please try to change following configuration:
config.public_file_server.enabled = ENV['RAILS_SERVE_STATIC_FILES'].present?
to
config.public_file_server.enabled = true
OR
you can set RAILS_SERVE_STATIC_FILES true in your passenger_env_var. That will also work.
Helo is this code works for you?
background: image-url(arrow.png) no-repeat left center;
This is driving me crazy - changes to css on my rails site only update when I run rake assets:precompile.
Does anyone know how to fix this, so assets will get compiled as they are changed?
I have a hunch the issue is in this config/environments/development.rb file:
Rails.application.configure do
# Settings specified here will take precedence over those in config/application.rb.
config.assets.compile = true
# In the development environment your application's code is reloaded on
# every request. This slows down response time but is perfect for development
# since you don't have to restart the web server when you make code changes.
config.cache_classes = false
# Do not eager load code on boot.
config.eager_load = false
# Show full error reports and disable caching.
config.consider_all_requests_local = true
config.action_controller.perform_caching = false
# Care if the mailer can't send.
config.action_mailer.raise_delivery_errors = true
# Print deprecation notices to the Rails logger.
config.active_support.deprecation = :log
config.action_mailer.delivery_method = :smtp
config.action_mailer.perform_deliveries = true
config.action_mailer.default_url_options = { :host => "http://localhost:3000/" }
# SMTP settings for gmail
config.action_mailer.smtp_settings = {
address: 'smtp.gmail.com',
port: 587,
domain: 'gmail.com',
user_name: ENV['gmail_username'],
password: ENV['gmail_password'],
authentication: 'plain',
enable_starttls_auto: true
}
# Raise an error on page load if there are pending migrations.
config.active_record.migration_error = :page_load
# Debug mode disables concatenation and preprocessing of assets.
# This option may cause significant delays in view rendering with a large
# number of complex assets.
config.assets.debug = true
# Asset digests allow you to set far-future HTTP expiration dates on all assets,
# yet still be able to expire them through the digest params.
config.assets.digest = true
# Adds additional error checking when serving assets at runtime.
# Checks for improperly declared sprockets dependencies.
# Raises helpful error messages.
config.assets.raise_runtime_errors = true
# Raises error for missing translations
# config.action_view.raise_on_missing_translations = true
end
Here is the top of my assets/stylesheets/application.css file:
/*
* 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 any plugin's vendor/assets/stylesheets directory 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 bottom of the
* compiled file so the styles you add here take precedence over styles defined in any styles
* defined in the other CSS/SCSS files in this directory. It is generally better to create a new
* file per style scope.
*
*= require_tree .
*= require_self
*/
As well as the top of 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 any plugin's vendor/assets/javascripts directory 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/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery_ujs
//= require_tree .
Edit: I should add that this only became a problem once I removed bootstrap...
To solve the issue:
rake assets:clobber
OR
delete the public/assets folder
From the comments above: Assets not compiling
In my local machine fontawesome is working perfectly (Im using 4.1 gem). But when uploaded to Heroku it stops working. I looks like bad unicode characters. I have included the following line in config and precompiled assets but it didn't work :
config.assets.paths << Rails.root.join(‘app’, ‘assets’, ‘fonts’)
config.assets.precompile += %w( .svg .eot .woff .ttf )
Please look at this image :
On the left is the problem. On the right is the correct version. What might be the problem? Here's the link to the Heroku app : http://fast-garden-6871.herokuapp.com/
Update It looks like /assets/fontawesome-webfont.eot is missing in the production machine!
In your css file, change url to asset-url under #font-face.
Also did you precompile assets after deployment?
RAILS_ENV=production rake assets:precompile
Finally fixed it! In custom.css I added the following lines:
#font-face {
font-family: 'FontAwesome';
src: asset-url('fontawesome-webfont.eot');
src: asset-url('fontawesome-webfont.eot?#iefix') format('embedded-opentype'), asset-url('fontawesome-webfont.woff') format('woff'), asset-url('fontawesome-webfont.ttf') format('truetype'), asset-url('fontawesome-webfont.svg#fontawesomeregular') format('svg');
font-weight: normal;
font-style: normal;
}
The problem was, rails will generate the font file with a hash like it generate css files. But the css is not updated with this new generated file. So the system can't find the font. With the above code, the system will assign the right url!
Working with Ruby 2.0 and Rails 4.0, I'm seeing a different behavior on my asset pipeline and I'm not sure why. Here's the gist of it...
I have in my ./app/assets/javascripts folder an application.js.coffee and google_analytics.js.coffee file.
In my app/views/layouts/application.html.haml, I have the following two lines:
= javascript_include_tag "application"
= javascript_include_tag "google_analytics"
This produces the following in the rendered page once deployed to production:
<script src="/assets/application-f15feb4200e0d1db4963a00b28fbe9ca.js"></script>
<script src="/javascripts/google_analytics.js"></script>
Note that the application include is compiled into the assets pipeline as expected, while the google_analytics script is not.
In development mode, everything's served from the assets pipe without the fingerprints as expected:
<script src="/assets/jquery.js?body=1"></script>
<!-- several other includes suppressed for brevity here -->
<script src="/assets/application.js?body=1"></script>
<script src="/assets/google_analytics.js?body=1"></script>
I also checked the production deployment and noted that google_analytics doesn't get pre-compiled and fingerprinted.
EDIT: After getting the comments and answers below, added the following to config/environments/production.rb and attempted another deploy:
ComingSoon::Application.configure do
config.serve_static_assets = false
config.assets.js_compressor = :uglifier
config.assets.compile = false
config.assets.digest = true
config.assets.version = '1.0'
config.assets.precompile += ['google_analytics.js.coffee']
end
Why is the sprockets assets pipeline not pre-compiling the google_analytics script and serving it up like it does the application script? how do I fix this?
You can add the google script to the precompile list in your config/environments/production.rb file on the config.assets.precompile setting. More here: What is the purpose of config.assets.precompile?
The google_analytics file needs to be added to the precompile list:
config.assets.precompile += ['google_analytics.js.coffee', ..]
Add above to your application.rb or production.rb as desired.
Note: Unless you have required the file in the application.js manifest file, through a direct require or through a require_tree, the js doesn't get compiled.