Your SlideShare is downloading. ×
Asset Pipeline
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×

Saving this for later?

Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime - even offline.

Text the download link to your phone

Standard text messaging rates apply

Asset Pipeline

1,387
views

Published on

Accompanying slides for presentation done at Utah Ruby User Group.

Accompanying slides for presentation done at Utah Ruby User Group.

Published in: Technology

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
1,387
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
11
Comments
0
Likes
1
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • \n
  • Transcript

    • 1. Asset Pipeline for dummies
    • 2. Why?
    • 3. Precompile
    • 4. Concatenate
    • 5. Minify
    • 6. Sprockets performs the asset packaging which takes the assets from all thespecified paths, compiles them together and places them in the target path(public/assets).
    • 7. Tilt is the template engine that Sprockets uses. This allows file types like scssand erb to be used in the asset pipeline.
    • 8. Files in Asset PathsAssetPipeline
    • 9. Asset Paths
    • 10. app/assets is for assets that are owned by the application, such as custom images, JavaScript files or stylesheets.
    • 11. app/assets is for assets that are owned by the application, such as custom images, JavaScript files or stylesheets.lib/assets is for your own libraries’ code that doesn’t really fit into the scope of the application or those libraries which are shared across applications.
    • 12. app/assets is for assets that are owned by the application, such as custom images, JavaScript files or stylesheets.lib/assets is for your own libraries’ code that doesn’t really fit into the scope of the application or those libraries which are shared across applications.vendor/assets is for assets that are owned by outside entities, such as code for JavaScript plugins and CSS frameworks.
    • 13. the manifest
    • 14. • require [path] inserts the contents of the asset source file specified by path. If the file is required multiple times, it will appear in the bundle only once.
    • 15. • require [path] inserts the contents of the asset source file specified by path. If the file is required multiple times, it will appear in the bundle only once.• include [path] works like require, but inserts the contents of the specified source file even if it has already been included or required.
    • 16. • require [path] inserts the contents of the asset source file specified by path. If the file is required multiple times, it will appear in the bundle only once.• include [path] works like require, but inserts the contents of the specified source file even if it has already been included or required.• require_directory [path] requires all source files of the same format in the directory specified by path. Files are required in alphabetical order.
    • 17. • require [path] inserts the contents of the asset source file specified by path. If the file is required multiple times, it will appear in the bundle only once.• include [path] works like require, but inserts the contents of the specified source file even if it has already been included or required.• require_directory [path] requires all source files of the same format in the directory specified by path. Files are required in alphabetical order.• require_tree [path] works like require_directory, but operates recursively to require all files in all subdirectories of the directory specified by path.
    • 18. • require [path] inserts the contents of the asset source file specified by path. If the file is required multiple times, it will appear in the bundle only once.• include [path] works like require, but inserts the contents of the specified source file even if it has already been included or required.• require_directory [path] requires all source files of the same format in the directory specified by path. Files are required in alphabetical order.• require_tree [path] works like require_directory, but operates recursively to require all files in all subdirectories of the directory specified by path.• require_self tells Sprockets to insert the body of the current source file before any subsequent require or include directives.
    • 19. • require [path] inserts the contents of the asset source file specified by path. If the file is required multiple times, it will appear in the bundle only once.• include [path] works like require, but inserts the contents of the specified source file even if it has already been included or required.• require_directory [path] requires all source files of the same format in the directory specified by path. Files are required in alphabetical order.• require_tree [path] works like require_directory, but operates recursively to require all files in all subdirectories of the directory specified by path.• require_self tells Sprockets to insert the body of the current source file before any subsequent require or include directives.• depend_on [path] declares a dependency on the given path without including it in the bundle. This is useful when you need to expire an asset’s cache in response to a change in another file.
    • 20. • require [path] inserts the contents of the asset source file specified by path. If the file is required multiple times, it will appear in the bundle only once.• include [path] works like require, but inserts the contents of the specified source file even if it has already been included or required.• require_directory [path] requires all source files of the same format in the directory specified by path. Files are required in alphabetical order.• require_tree [path] works like require_directory, but operates recursively to require all files in all subdirectories of the directory specified by path.• require_self tells Sprockets to insert the body of the current source file before any subsequent require or include directives.• depend_on [path] declares a dependency on the given path without including it in the bundle. This is useful when you need to expire an asset’s cache in response to a change in another file.• stub [path] allows dependency to be excluded from the asset bundle. The path must be a valid asset and may or may not already be part of the bundle. Once stubbed, it is blacklisted and can’t be brought back by any other require.
    • 21. usage
    • 22. Misconceptions
    • 23. Files must belong in their respective paths.For example, all JavaScript files must be in a javascripts folder within anasset path.
    • 24. Files must belong in their respective paths.For example, all JavaScript files must be in a javascripts folder within anasset path.The truth is that the paths (stylesheets, javascripts,images) are only there for organization.You can haveall the assets in a single folder or in a hundred.
    • 25. Sass files need to use *erb* extension to allow for asset path inclusionswithin the files.
    • 26. Sass files need to use *erb* extension to allow for asset path inclusionswithin the files.The truth is that sass-rails provides -url and-path helpers for the following asset types: image,font, video, audio, JavaScript and stylesheet.
    • 27. gems
    • 28. faq
    • 29. Why doesnt the auto-generated scss and coffeescriptonly get included in their respective controller views?
    • 30. Why doesnt the auto-generated scss and coffeescriptonly get included in their respective controller views?
    • 31. Do I have to use the asset pipeline?
    • 32. Do I have to use the asset pipeline?
    • 33. What happens if there are duplicate file names in different asset folders?
    • 34. What happens if there are duplicate file names in different asset folders?
    • 35. How can I precompile assets that arent to be used in the pipeline?
    • 36. How can I precompile assets that arent to be used in the pipeline?
    • 37. How can I precompile additional assets without having to include them in the manifest?
    • 38. How can I precompile additional assets without having to include them in the manifest?
    • 39. PrecompileConcatenate Minify
    • 40. http://coderberry.me