More Related Content Similar to Rails3 asset-pipeline Similar to Rails3 asset-pipeline (20) Rails3 asset-pipeline4. What is the Asset
Pipeline?
• Build system for your static assets
• Javascript
• CSS
• Images
5. What is the Asset
Pipeline?
• Sass and Coffeescript support by default
• Minifies and concatenates resources
6. Defaults
source 'https://rubygems.org'
gem 'rails', '3.2.5'
# Gems used only for assets and not required
# in production environments by default.
group :assets do
gem 'sass-rails', '~> 3.2.3'
gem 'coffee-rails', '~> 3.2.1'
# See https://github.com/sstephenson/execjs#readme for
more supported runtimes
# gem 'therubyracer', :platforms => :ruby
gem 'uglifier', '>= 1.0.3'
end
gem 'jquery-rails'
8. app/
asssets/
javascripts/
stylesheets/
images/
vendor/
assets/
javascripts/
stylesheets/
public/
assets/
9. app/
asssets/
javascripts/
application.js
stylesheets/
application.css
images/
rails.png
10. vendor/
assets/
javascripts/
jquery.masonry.js
tagit.js
stylesheets/
tagit.css
11. public/
assets/
application-e4b51606cd77f.js
rails-e4b51606cd77fda26.png
application-e4b51606cd77fd.css
13. Sprockets
Javascript
//= require core.js
//= require jquery.infinitescroll
//= require jquery.masonry.min
//= require jquery.backstretch.min
//= require bootstrap-alert
//= require bootstrap-dropdown
//= require bootstrap-modal
//= require bootstrap-tab
//= require_self
application.js
14. Sprockets
CSS
/**
*= require "bootstrap_and_overrides";
*= require 'sprites';
*= require 'layout';
*= require 'typography';
*= require 'admin';
*= require 'clubs';
*= require 'posts';
*= require 'sharing';
*= require 'tags';
*= require 'topics';
*= require 'users';
*= require 'welcome';
*= require 'responsive';
*= require 'landing_pages';
*/
application.css
15. Sprockets
= stylesheet_link_tag "application"
= javascript_include_tag "application"
35. /**
*= require "bootstrap_and_overrides";
*= require 'sprites';
*= require 'layout';
*= require 'typography';
*= require 'admin';
*= require 'clubs';
*= require 'posts';
*= require 'sharing';
*= require 'tags';
*= require 'topics';
*= require 'users';
*= require 'welcome';
*= require 'responsive';
*= require 'landing_pages';
*/
36. @import "bootstrap_and_overrides";
@import 'sprites';
@import 'layout';
@import 'typography';
@import 'admin';
@import 'clubs';
@import 'posts';
@import 'sharing';
@import 'tags';
@import 'topics';
@import 'users';
@import 'welcome';
@import 'responsive';
@import 'landing_pages';
41. core.js
//= require jquery
//= require jquery.ui.autocomplete
//= require jquery_ujs
//= require tagit
//= require underscore
//= require jquery.infinitescroll
//= require jquery.backstretch.min
//= require bootstrap-transition
//= require bootstrap-collapse
//= require bootstrap-tab
//= require handlebars-1.0.0.beta.6.js
//= require jwplayer.js
//= require relative-date
//= require 'facebook'
//= require 'comments'
//= require 'layout'
//= require 'posts'
//= require 'sharing'
//= require 'users'
//= require_self
42. application.js
//= require core.js
//= require jquery.effects.blind
//= require jquery.infinitescroll
//= require jquery.masonry.min
//= require jquery.backstretch.min
//= require jquery.preview.full
//= require jquery.truncator
//= require jquery.panda-uploader.js
//= require bootstrap-alert
//= require bootstrap-dropdown
//= require bootstrap-modal
//= require bootstrap-tab
//= require gmaps4rails/googlemaps
//= require 'sign-in'
//= require_self
44. Dependencies
#= require_tree ./posts
$ ->
Post.embedlyPreview('#post_link_url')
Post.embedlyPreview('#post_video_url')
replaceTimesWithRelativeStrings()
setupTagging()
setupPanda()
loadVideo()
setupVideoPostOptions()
setupShareLinks()
setupInfiniteScroll()
posts.js
Editor's Notes \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