Rails - Understanding application.js and application.css

Question

New to rails. Just trying to understand these two files in the \\assests directory.

For example, the application.js file has lines such as:

//= require j         


        

Answer 1

I think it gets them from the gem(s) that are installed on your system and included in this project via your Gemfile.

You can learn at http://guides.rubyonrails.org/asset_pipeline.html#manifest-files-and-directives

Answer 2

It's rails magic! So no you cannot see the files within your own project directory. If you are really curious you can checkout the code for the gem on the gem's github page https://github.com/twbs/bootstrap

Also, if you really want to change something in the gem, you can fork the code into you own github, change things on your local branch, and then specify your own github as the source for the gem in your gemfile such as...

gem 'twitter-bootstrap', :git => 'git@github.com:my_github/twitter_bootstrap.git'

But, you might not want to try that if you are really new to rails ;)

Answer 3

the application.css and application.js are not regular css and js files (they could be, but they serve a different purpose

both are manifest files which tell the asset pipeline along with sprockets for js

so, as correctly pointed out by Michael Durrant's answer, http://guides.rubyonrails.org/asset_pipeline.html#manifest-files-and-directives will be the correct place

but according to your other questions it seems you are missing a pretty critical piece of the puzzle

Rails mainly works with gems. Gems are pieces of ruby code which you can tell to add to your rails app via bundler

when you add such a gem like the bootstrap gem, it gets installed (by default in the gems library where you have ruby installed - something like Ruby193\lib\ruby\gems\1.9.1\gems)

If you go there and look for the bootstrap gem you will find the css and js files that are included in the app, and also the jquery and jquery_ujs that you include in the manifest file

since the gems get installed alongside rails, rails don't mind where the files are (as long as it knows where they are).

So the manifest file tells rails "Hey, include these file for me, in this specific order" That is why you can include files that you wrote which are in the assets folder and files are included in a gem

If you don't include the files in the manifest but still install the gem that is equivalent to writing a css or js file, placing it in some folder and not telling rails that it exists. When you do tell rails where it is, via the manifest file, it will include it in the asset compilation process and you can access it regularly.

Alternativly, you don't have to use the asset pipeline for assets

you can include css and js file with a regular

 <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

and just host your files somewhere and point it to the files, but the asset pipeline has many advantages and its really makes your life easier when you get to know it

Answer 4

To understand it, you have to look at Sprockets, which is used for compiling and serving web assets.

You can find these files using gem which. Here is an example with bootstrap-sass:

~ gem which bootstrap-sass
/Users/andr/.rbenv/versions/1.9.3-p194/lib/ruby/gems/1.9.1/gems/bootstrap-sass-2.3.0.1/lib/bootstrap-sass.rb

The explanation of @import 'bootstrap': https://github.com/thomas-mcdonald/bootstrap-sass#css and there is an open issue with comments.