How to fetch content of CSS file with Javascript in a Ruby on Rails application?

Question

I need to fetch a CSS file's content with JavaScript in a Ruby on Rails application, but it seems that every request I make tries to make a request to a page rather than fetch a specific file.

I'm not sure how an AJAX request works when working with Ruby on Rails, and my searches doesn't really answer this question either.

This is how I make the request (using jQuery's $.ajax ):

$.ajax({
    url: './assets/stylesheets/application.css.scss.erb',
    success: function(data) {
        console.log(data);
    }
});

But this just spits out this error:

GET http://localhost:3000/assets/stylesheets/application.css.scss.erb 404 (Not Found)

This makes sense since I don't have a route of that kind, but what do I need to add in order to get a specific file's content rather than a route's?

Answer 1

You may want to learn how the asset pipeline work, I suggest reading Asset Pipeline .

But in your case the css file will be at:

http://localhost:3000/assets/application.css

And that file includes all the css precomplied in that file, meaning if your application.css file is something like :

/*
 *= require datepicker
 *= require responsive
 *= require themes
 *= require_self
 */

It means the application css file will contains all of those files content within it.

Anyway, regarding your question- so you can try:

$.ajax({
    url: './assets/application.css',
    success: function(data) {
        console.log(data);
    }
});