CODEWITHSUNDEEP
ruby-on-railsasset-pipeline
catmal
catmal

Reputation: 1758

Rails assets usage clarification

I am new to rails and I'm a bit confused about how assets are loaded. I can get things working but I would like to understand what really happens behind the scenes.

I have been reading the documentation but there are things that I don't understand completely.

MANIFEST FILE

First thing that confuses me is the usage of manifest files.

For instance if in my app/assets/javascripts/application.js file I have:

//= require_tree .

Rails documentation says:

tells Sprockets to recursively include all JavaScript files in the specified directory into the output

What isn't clear to me is which directory? app/assets/javascripts/?

Does that mean that if I add a file in app/assets/javascripts/ it will be loaded and served?

If I add a gem that requires to add a file example.js I need to add to the manifest file:

//= require example.js

But why is this necessary if //= require_tree already loads and serve files in app/assets/javascripts/ which is the location where I have put my example.js? Ok that allows me to specify the order if later I add more requires. But other than that?

HTML FILE

And then the script to be included in application.html.erb

<%= javascript_include_tag ('application'), 'data-turbolinks-track' => true %>

I understand this loads the application.js file mentioned above and therefore the various //= require in it.

Sometimes happens that is required to script the particular file as:

<script src="js/example.js"></script>

Is this scenario wouldn't be <script src="js/example.js"></script> doing the exact same thing of //= require example.js?

PUBLIC VS APP ASSETS

I understand that if I place my example.js file on public/assets folder it won't be compiled but served separately. Why would I do that? Is it reasonable to do it in case a file is not served correctly when concatenated and compiled and works only if served separated? In other words, if I include a .js file on app/assest and it has problems to load or break things, is it worth to try to remove it from there and move it to public/assets or does this just not make sense?

APP ASSETS VS VENDOR ASSETS

On which scenario should I add a file to vendor assets instead of app assets? What is the difference between adding it to a place or another? And in my vendor/assets/javascripts I have only an empty .keep file. So there'n so such thing as manifest file on app/assets. How are files in this folder referenced then?

Upvotes: 0

Views: 50

Answers (1)

max
max

Reputation: 102036

For directives that take a path argument, you may specify either a logical path or a relative path. Relative paths begin with ./ and reference files relative to the location of the current file.

So //= require_tree . tells sprockets to load any files in app/assets/javascripts/ and concatenate them into application.js.

Is this scenario wouldn't be <script src="js/example.js"></script> doing the exact same thing of //= require example.js?

No. Rails serves the assets as seperate files in development so that you get a meaningful line number and file reference when errors occur.

In production it concatenates and minifies the assets which is important for performance.

Sprockets does not check your views / layouts for script tags. So the the former would result in two requests.

I understand that if I place my example.js file on public/assets folder it won't be compiled but served separately. Why would I do that?

The public directory is placed under the servers web root. Since the files there are served without much intervention its a good place for things like error pages or where you need assets that have a static name without a cache busting fingerprint.

On which scenario should I add a file to vendor assets instead of app assets? What is the difference between adding it to a place or another?

/vendor/assets is the place to put assets that are not created by you or which are not part of the application. Both are added to the sprockets load paths so the results are identical. Its rather just a question of code organisation.

Upvotes: 1

Related Questions