I'm using Rails 3.1. I'm starting to have a problem -- any time I update my application.css it doesn't update the CSS of the webpage I'm working on. The server seems to be fetching an old version of the CSS instead of keeping up with the changes I make in my application. What are some possible reasons and solutions for this? Does it perhaps have to do with precompilation? (By the way I'm of course doing this all on my local machine.)
I'm sorry but I can't really tell when this started happening - which would be useful. I had been working on other parts and came back to this a few weeks later to find out that the application.css file wasn't affecting any changes.
By the way, I haven't changed
<%= stylesheet_link_tag "application" %>
... it's still there in my application. Also, in-line CSS still works, which is why I know it's a problem with the application.css.
Go into your public folder and delete the assets folder. When you deployed (or did a push) it precompiled your assets.
Show as your Source Page or Log.
Try:
<%= stylesheet_link_tag :application %>
And tell where you have application.sass or application.scss
Go to tmp > cache
Delete assets folder
Only solution that worked for me
Related
In migrating an app to Rails 5.1 for the first time, I'm experimenting with yarn instead of bower to manage frontend dependencies.
Everything is working great, and I'm able to include js and css files via the relevant application.js/css manifest files.
But, if these files depend on other resources (e.g., a directory of images, fonts, etc.), then Rails knows nothing about them.
Given a yarn package that includes:
/css
|-styles.css
/images
|-background.jpg
where
#styles.css
.background {
background-image: url(../images/background.jpg);
}
Logs are (obviously) showing
No route matches [GET] "/images/background.jpg"
How do I ensure that Rails is aware of these images in Yarn packages and properly compiles them?
Is this possible? Or am I overlooking something obvious?
I had the same problem. Following are some good references
https://edgeguides.rubyonrails.org/webpacker.html#using-webpacker-for-css
https://github.com/rails/webpacker/issues/349
Basically you need to do following things
Require the css file like a js file but with css extension included in /app/javascript/packs/application.js (Yes, require css in javascript)
Add <%= stylesheet_pack_tag "application" %> in layout file if already not there
If you don't already have it, create file (even if empty) /app/javascript/packs/application.scss
I am using Rails 3.2 with asset pipeline. It works fine, however there is one particular case where I want one particular third party assets no to be precompiled.
I moved the assets back into public/javascripts directory hoping that I can use the tool in the same way as before, however I get the following error at runtime:
tiny_mce/tiny_mce.js isn't precompiled
I am puzzled, because I thought the third party JavaScript tool would be excluded from asset pipeline just by putting it in the public directory.
In my view I have the following include:
<%= javascript_include_tag 'tiny_mce/tiny_mce' %>
Any light on this subject would be appreciated.
Many Thanks.
You may consider to move your vendor assets in app/vendor/assets/javascripts directory , but not in public . The publicdirectory is used in production environment , after the assets are precompiled .
In case you rely on asset-pipeline , it is enough to include the tiny-mce in manifest file application.js like this :
/= require tiny_mce/tiny_mce
and avoid any javascript_include_tag in your views .
I have a ruby on rails app that uses highcharts.
Locally it works like a charm, however when I push the app to Heroku, Highcharts stops working and the div tag that is supposed to contain the chart appears empty.
I even tested it with one of the Highcharts examples (which has only hardcoded data), and still nothing.
Figured it out: The problem was in the precompiling of assets. Turned out that highcharts was not precompiled
Added :
config.assets.precompile += ['rollover.js', 'highcharts.js']
to production.rb (i suppose application.rb should work as well)
and
to layout file.
(since i expected all javascript files gets compiled in application.jss i only had <%= javascript_include_tag "application" %> in my layout file)
Sounds like Highcharts is not loading - either because it isn't being pushed to Heroku or because it isn't being served properly. Go to the URL where highcharts.js should be and see if you get the JavaScript or a 404.
If you can reach highcharts.js without issue then the problem is most likely in the setup code. Check and see if the appropriate variables are loaded onto the page (using the web developer tools for the browser you are testing in) and if there are any JavaScript errors showing up when the page is loaded.
Using lazy highcharts gem. Googled for an hour Nothing worked out for me.
Finally I've copied highcharts.js from Vendor directory and pasted it to assets.
Viola!
I am quite new with Rails and I am having some irritating problems with caching of css files.
I have a .css.less file with imports inside it. It's the only stylesheet the app includes, so the other files get imported only once and by this unique stylesheet.
One of those imported .css.less stylesheets seems to be cached somewhere, because does not change in the browser when I change it's source.
I can only see the changes I made if I change something in the root stylesheet.
I have the server in development mode, so the caching should be off. I have also used <%= stylesheet_include_tag "style", :cache => false %>
I tried with Chrome and Firefox, with and without clearing their cache too. Always the same result, if I work only on that file the css the page receives when reloaded doesn't have the changes...
I also stopped the server and rm everything in the tmp folder of the app. No changes.
I am using Rails 3.1 with Ruby 1.9.3, with the less-bootstrap-rails gem. Both the root stylesheet and the imported one have .css.less extension.
What am I missing?
Thank you!
This is an area where I think the asset pipeline is broken, but I don't think there's a good fix.
If I remember correctly, to get changes in files you've included/required in your .css.less file, you need to change the .css.less file itself.
I had this on Rails 4.0.8, infuriating. The config changes mentioned above didn't help. Here's what seems to have fixed it for me:
Ensure NO FILES share a base name. For example, you have a reports.css.less and a reports.js.coffee? Doesn't matter if they're in the same directory or not. Rename or delete one of them. (I changed it to reports-styles.css.less).
Blow away your cache: rm -rf tmp/cache
Restart your Rails app.
This appears to be a decent fix but, since I don't know what's actually going on, this could be totally false and it's just working by coincidence now. Sorry this answer isn't more rigorous!
I've just came across the exact same problem.
I found that if you rename your *.css.less file (the one with the imports inside) to *.less, then this weird cacheing problem gets resolved.
Add this to your config/application.rb
# Version of your assets, change this if you want to expire all your assets
config.assets.version = '1.0'
See more at: Ruby on Rails Guide: Asset Pipeline
I am using Ruby on Rails 3.0.10 and I would like to auto-build and load different CSS stylesheet files depending on if I am running my application in the development or in the production mode.
I would like to auto-"minimize" CSS files for performance reasons and to load those related "minimized" files because I do not want to show to the "public audience" the content of my comments present in my CSS file (note: users can access theme, for example, by using the FireBug plugin for the Mozilla Firefox browser). I would like to do that also for javascript files.
How can I do that?
P.S.: I am planning to switch to the Ruby on Rails v3.1...
In your layout you probably have something like:
<%= stylesheet_link_tag "production.css" %>
Just add another stylesheet there but wrap it in a conditional that checks the rails environment.
<%= stylesheet_link_tag "development.css" if Rails.env.production? %>
For Rails 3.0 there are many plugins to minify your css and javascript.
I use smurf.
gem "smurf"
Part of the process of minification is that it removes comments.
In Rails 3.1 production will uglify your javascript, so comments should be removed by default.
But if you insist on using a different stylesheet, take a look at the other answer.