sprockets 3.7.2 → 4.0.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (96) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +47 -267
  3. data/README.md +477 -321
  4. data/bin/sprockets +11 -7
  5. data/lib/rake/sprocketstask.rb +3 -2
  6. data/lib/sprockets.rb +99 -39
  7. data/lib/sprockets/add_source_map_comment_to_asset_processor.rb +60 -0
  8. data/lib/sprockets/asset.rb +31 -23
  9. data/lib/sprockets/autoload.rb +5 -0
  10. data/lib/sprockets/autoload/babel.rb +8 -0
  11. data/lib/sprockets/autoload/closure.rb +1 -0
  12. data/lib/sprockets/autoload/coffee_script.rb +1 -0
  13. data/lib/sprockets/autoload/eco.rb +1 -0
  14. data/lib/sprockets/autoload/ejs.rb +1 -0
  15. data/lib/sprockets/autoload/jsminc.rb +8 -0
  16. data/lib/sprockets/autoload/sass.rb +1 -0
  17. data/lib/sprockets/autoload/sassc.rb +8 -0
  18. data/lib/sprockets/autoload/uglifier.rb +1 -0
  19. data/lib/sprockets/autoload/yui.rb +1 -0
  20. data/lib/sprockets/autoload/zopfli.rb +7 -0
  21. data/lib/sprockets/babel_processor.rb +66 -0
  22. data/lib/sprockets/base.rb +49 -12
  23. data/lib/sprockets/bower.rb +5 -2
  24. data/lib/sprockets/bundle.rb +40 -4
  25. data/lib/sprockets/cache.rb +36 -1
  26. data/lib/sprockets/cache/file_store.rb +25 -3
  27. data/lib/sprockets/cache/memory_store.rb +9 -0
  28. data/lib/sprockets/cache/null_store.rb +8 -0
  29. data/lib/sprockets/cached_environment.rb +14 -19
  30. data/lib/sprockets/closure_compressor.rb +1 -0
  31. data/lib/sprockets/coffee_script_processor.rb +18 -4
  32. data/lib/sprockets/compressing.rb +43 -3
  33. data/lib/sprockets/configuration.rb +3 -7
  34. data/lib/sprockets/context.rb +97 -24
  35. data/lib/sprockets/dependencies.rb +1 -0
  36. data/lib/sprockets/digest_utils.rb +25 -5
  37. data/lib/sprockets/directive_processor.rb +45 -35
  38. data/lib/sprockets/eco_processor.rb +1 -0
  39. data/lib/sprockets/ejs_processor.rb +1 -0
  40. data/lib/sprockets/encoding_utils.rb +1 -0
  41. data/lib/sprockets/environment.rb +9 -4
  42. data/lib/sprockets/erb_processor.rb +28 -21
  43. data/lib/sprockets/errors.rb +1 -0
  44. data/lib/sprockets/exporters/base.rb +71 -0
  45. data/lib/sprockets/exporters/file_exporter.rb +24 -0
  46. data/lib/sprockets/exporters/zlib_exporter.rb +33 -0
  47. data/lib/sprockets/exporters/zopfli_exporter.rb +14 -0
  48. data/lib/sprockets/exporting.rb +73 -0
  49. data/lib/sprockets/file_reader.rb +1 -0
  50. data/lib/sprockets/http_utils.rb +25 -7
  51. data/lib/sprockets/jsminc_compressor.rb +32 -0
  52. data/lib/sprockets/jst_processor.rb +11 -10
  53. data/lib/sprockets/loader.rb +87 -67
  54. data/lib/sprockets/manifest.rb +64 -62
  55. data/lib/sprockets/manifest_utils.rb +9 -6
  56. data/lib/sprockets/mime.rb +8 -42
  57. data/lib/sprockets/npm.rb +52 -0
  58. data/lib/sprockets/path_dependency_utils.rb +3 -11
  59. data/lib/sprockets/path_digest_utils.rb +2 -1
  60. data/lib/sprockets/path_utils.rb +87 -7
  61. data/lib/sprockets/paths.rb +1 -0
  62. data/lib/sprockets/preprocessors/default_source_map.rb +49 -0
  63. data/lib/sprockets/processing.rb +31 -61
  64. data/lib/sprockets/processor_utils.rb +24 -35
  65. data/lib/sprockets/resolve.rb +177 -93
  66. data/lib/sprockets/sass_cache_store.rb +2 -6
  67. data/lib/sprockets/sass_compressor.rb +13 -1
  68. data/lib/sprockets/sass_functions.rb +1 -0
  69. data/lib/sprockets/sass_importer.rb +1 -0
  70. data/lib/sprockets/sass_processor.rb +30 -9
  71. data/lib/sprockets/sassc_compressor.rb +56 -0
  72. data/lib/sprockets/sassc_processor.rb +297 -0
  73. data/lib/sprockets/server.rb +26 -23
  74. data/lib/sprockets/source_map_processor.rb +66 -0
  75. data/lib/sprockets/source_map_utils.rb +483 -0
  76. data/lib/sprockets/transformers.rb +63 -35
  77. data/lib/sprockets/uglifier_compressor.rb +21 -11
  78. data/lib/sprockets/unloaded_asset.rb +13 -11
  79. data/lib/sprockets/uri_tar.rb +1 -0
  80. data/lib/sprockets/uri_utils.rb +11 -8
  81. data/lib/sprockets/utils.rb +41 -74
  82. data/lib/sprockets/utils/gzip.rb +46 -14
  83. data/lib/sprockets/version.rb +2 -1
  84. data/lib/sprockets/yui_compressor.rb +1 -0
  85. metadata +127 -23
  86. data/LICENSE +0 -21
  87. data/lib/sprockets/coffee_script_template.rb +0 -17
  88. data/lib/sprockets/deprecation.rb +0 -90
  89. data/lib/sprockets/eco_template.rb +0 -17
  90. data/lib/sprockets/ejs_template.rb +0 -17
  91. data/lib/sprockets/engines.rb +0 -92
  92. data/lib/sprockets/erb_template.rb +0 -11
  93. data/lib/sprockets/legacy.rb +0 -330
  94. data/lib/sprockets/legacy_proc_processor.rb +0 -35
  95. data/lib/sprockets/legacy_tilt_processor.rb +0 -29
  96. data/lib/sprockets/sass_template.rb +0 -19
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 46e0f0a150aa8333d2a1d2663167b6f20c1e77db067cea7b545f75927f770807
4
- data.tar.gz: 5acd5cb5c64e240dd8180e91f34620195fa1433e625ee48a132fdae58be71ba5
3
+ metadata.gz: a4743994bc846327ac80bde662aa5a26fd95ce5cca2dd149deafe0fe94b6bf00
4
+ data.tar.gz: 454485ef7d2c5aac60c69b7d7042ed1b74245afecfeadc72c7e9bc290dc8b5b8
5
5
  SHA512:
6
- metadata.gz: 97a06eb2e0767903da7bcda387211d881f3b98d57269a8abed5045e277db5f133f381c4f8fd23fcccf45a4032c85309841abba13b9218a52b21121a5a9bfc02a
7
- data.tar.gz: 1d9c8d75bab64c366473226cc61806cd64c1951a67d90cc1220c1474e6a02cc5003b2dffb1b6324abefb7e7c8b292145635ac0bed6ae947a35393d67acd3c40e
6
+ metadata.gz: c6d61894b3f53a76bf1f04c3f2fe74143b33e43d5fbdc3db216bdf0ad88d06f8a73fc61bd12071ee79e8aab49b36cb14685f6bb2d86582387cbc5522cef305a3
7
+ data.tar.gz: ca2bff624116f6de55ce4f9c6371be9d71245d2883c4837cf5a1b4969006fbdf8507b358c7986cccb03edb00711367538176ed2701a1e725cde1206163c64e2c
@@ -1,296 +1,76 @@
1
- **3.7.2** (June 19, 2018)
1
+ **Master**
2
2
 
3
- * Security release for [CVE-2018-3760](https://cve.mitre.org/cgi-bin/cvename.cgi?name=CVE-2018-3760).
3
+ Get upgrade notes from Sprockets 3.x to 4.x at https://github.com/rails/sprockets/blob/master/UPGRADING.md
4
4
 
5
- **3.7.1** (December 19, 2016)
5
+ ## 4.0.2
6
6
 
7
- * Ruby 2.4 support for Sprockets 3.
7
+ - Fix `etag` and digest path compilation that were generating string with invalid digest since 4.0.1.
8
8
 
9
- **3.7.0** (July 21, 2016)
9
+ ## 4.0.1
10
10
 
11
- * Deprecated interfaces now emit deprecation warnings #345
11
+ - Fix for Ruby 2.7 keyword arguments warning in `base.rb`. [#660](https://github.com/rails/sprockets/pull/660)
12
+ - Fix for when `x_sprockets_linecount` is missing from a source map.
13
+ - Fix subresource integrity to match the digest of the asset.
12
14
 
13
- **3.6.3** (July 1, 2016)
15
+ ## 4.0.0
14
16
 
15
- * Faster asset lookup in large directories #336
16
- * Faster PathUtils.match_path_extname https://github.com/rails/sprockets/commit/697269cf81e5261fdd7072e32bd489403027fd7e
17
- * Fixed uglifier comment stripping #326
18
- * Error messages now show load path info #313
17
+ - Fixes for Ruby 2.7 keyword arguments warnings [#625](https://github.com/rails/sprockets/pull/625)
18
+ - Manifest files are sorted alphabetically [#626](https://github.com/rails/sprockets/pull/626)
19
19
 
20
- **3.6.2** (June 21, 2016)
20
+ ## 4.0.0.beta10
21
21
 
22
- * More performance improvements.
22
+ - Fix YACB (Yet Another Caching Bug) [Fix broken expansion of asset link paths](https://github.com/rails/sprockets/pull/614)
23
23
 
24
- **3.6.1** (June 17, 2016)
24
+ ## 4.0.0.beta9
25
25
 
26
- * Some performance improvements.
26
+ - Minimum Ruby version for Sprockets 4 is now 2.5+ which matches minimum ruby verision of Rails [#604]
27
+ - Fix threading bug introduced in Sprockets 4 [#603]
28
+ - Warn when two potential manifest files exist. [#560]
27
29
 
28
- **3.6.0** (April 6, 2016)
30
+ ## 4.0.0.beta8
29
31
 
30
- * Add `Manifest#find_sources` to return the source of the compiled assets.
31
- * Fix the list of compressable mime types.
32
- * Improve performance of the `FileStore` cache.
32
+ - Security release for [CVE-2018-3760](https://cve.mitre.org/cgi-bin/cvename.cgi?name=CVE-2018-3760)
33
33
 
34
- **3.5.2** (December 8, 2015)
34
+ ## 4.0.0.beta7
35
35
 
36
- * Fix JRuby bug with concurrent-ruby.
37
- * Fix disabling gzip generation in cached environments.
36
+ - Fix a year long bug that caused `Sprockets::FileNotFound` errors when the asset was present [#547]
37
+ - Raise an error when two assets such as foo.js and foo.js.erb would produce the same output artifact (foo.js) [#549 #530]
38
+ - Process `*.jst.eco.erb` files with ERBProcessor
38
39
 
39
- **3.5.1** (December 5, 2015)
40
+ ## 4.0.0.beta6
40
41
 
41
- * Fix gzip asset generation for assets already on disk.
42
+ - Fix source map line offsets [#515]
43
+ - Return a `400 Bad Request` when the path encoding is invalid. [#514]
42
44
 
43
- **3.5.0** (December 3, 2015)
45
+ ## 4.0.0.beta5
44
46
 
45
- * Reintroduce Gzip file generation for non-binary assets.
47
+ - Reduce string allocations
48
+ - Source map metadata uses compressed form specified by the [source map v3 spec](https://docs.google.com/document/d/1U1RGAehQwRypUTovF1KRlpiOFze0b-_2gc6fAH0KY0k). [#402] **[BREAKING]**
49
+ - Generate [index maps](https://docs.google.com/document/d/1U1RGAehQwRypUTovF1KRlpiOFze0b-_2gc6fAH0KY0k/edit#heading=h.535es3xeprgt) when decoding source maps isn't necessary. [#402]
50
+ - Remove fingerprints from source map files. [#402]
46
51
 
47
- **3.4.1** (November 25, 2015)
52
+ ## 4.0.0.beta4
48
53
 
49
- * PathUtils::Entries will no longer error on an empty directory.
54
+ - Changing the version now busts the digest of all assets [#404]
55
+ - Exporter interface added [#386]
56
+ - Using ENV vars in templates will recompile templates when the env vars change. [#365]
57
+ - Source maps for imported sass files with sassc is now fixed [#391]
58
+ - Load paths now in error messages [#322]
59
+ - Cache key added to babel processor [#387]
60
+ - `Environment#find_asset!` can now be used to raise an exception when asset could not be found [#379]
50
61
 
51
- **3.4.0** (October 5, 2015)
62
+ ## 4.0.0.beta3
52
63
 
53
- * Expose method to override the sass cache in the SassProcessor.
64
+ - Source Map fixes [#255] [#367]
65
+ - Performance improvements
54
66
 
55
- **3.3.5** (September 25, 2015)
67
+ ## 4.0.0.beta2
56
68
 
57
- * Fix bug related to absolute path being reintroduced into history cache #141.
69
+ - Fix load_paths on Sass processors [#223]
58
70
 
59
- **3.3.4** (September 1, 2015)
60
71
 
61
- * Relative cache contents now work with windows.
72
+ ## 4.0.0.beta1
62
73
 
63
- **3.3.3** (August 21, 2015)
74
+ - Initial release of Sprockets 4
64
75
 
65
- * Remove more absolute paths from cache contents.
66
-
67
- **3.3.2** (August 19, 2015)
68
-
69
- * Fix cache contents to use relative paths instead of absolute paths.
70
-
71
- **3.3.1** (August 15, 2015)
72
-
73
- * Fix legacy Tilt integration when locals is required argument.
74
-
75
- **3.3.0** (August 12, 2015)
76
-
77
- * Change internal cache key to use relative asset paths instead of absolute paths.
78
-
79
- **3.2.0** (June 2, 2015)
80
-
81
- * Updated SRI integrity to align with spec changes
82
- * Deprecated Manifest integrity attribute
83
- * Cleanup concatenating JS sources with newlines
84
-
85
- **3.1.0** (May 10, 2015)
86
-
87
- * Removed "index" logical path normalization. Asset#logical_path is always the
88
- full logical path to the index file.
89
- * Fixed static asset mtimes
90
- * Fix manifest cleanup by age
91
- * Removed redundant minifier level cache
92
- * Updated SRI format according to spec changes
93
-
94
- **3.0.3** (April 27, 2015)
95
-
96
- * Fix static asset mtime fallback
97
- * Only warn when specified asset version can not be loaded.
98
-
99
- **3.0.2** (April 22, 2015)
100
-
101
- * Ensure legacy Tilt handlers return String class data. Fixes issues with Haml
102
- Tilt handler.
103
- * Type check and improve error messages raised on bad processor returned results.
104
- * Improve error message for relative paths not under load path.
105
- * Changed HTML encoding fallback from ISO-8859-1 to default external.
106
- * Avoid falling back to 0 mtimes which may cause warnings with tar
107
-
108
- **3.0.1** (April 14, 2015)
109
-
110
- * Fixed `Context#depend_on` with paths outside the load path
111
-
112
- **3.0.0** (April 12, 2015)
113
-
114
- [Guide to upgrading from Sprockets 2.x to 3.x](https://github.com/rails/sprockets/blob/3.x/UPGRADING.md)
115
-
116
- * New processor API. Tilt interface is deprecated.
117
- * Improved file store caching backend.
118
- * MIME Types now accept charset custom charset detecters. Improves support for UTF-16/32 files.
119
- * Environment#version no longer affects asset digests. Only used for busting the asset cache.
120
- * Removed builtin support for LESS.
121
- * Removed `//= include` directive support.
122
- * Deprecated `BundledAsset#to_a`. Use `BundledAsset#included` to access debugging subcomponents.
123
- * Support circular dependencies. For parity with ES6 modules.
124
- * Manifest compilation will no longer generate .gz files by default. [Mixing
125
- Content-Encoding and ETags is just a bad
126
- idea](https://issues.apache.org/bugzilla/show_bug.cgi?id=39727)
127
- * Added linked or referenced assets. When an asset is compiled, any of its links will be compiled as well.
128
- * Introduce some limitations around enumerating all logical paths. 4.x will deprecate it and favor linked manifests for compliation.
129
- * Add Asset integrity attribute for Subresource Integrity
130
- * Default digest changed to SHA256. Configuring `digest_class` is deprecated.
131
- * Rename `Asset#digest` to `Asset#hexdigest`. `Asset#digest` is deprecated and will
132
- return a raw byte String in 4.x.
133
- * Added transitional compatibility flag to `Environment#resolve(path, compat: true)`. 2.x mode operates with `compat: true` and 4.x with `compat: false`
134
- * `manifest-abc123.json` renamed to `.sprockets-abc123.json`
135
-
136
- **2.12.3** (October 28, 2014)
137
-
138
- * Security: Fix directory traversal bug in development mode server.
139
-
140
- **2.12.2** (September 5, 2014)
141
-
142
- * Ensure internal asset lookups calls are still restricted to load paths within
143
- asset compiles. Though, you should not depend on internal asset resolves to be
144
- completely restricted for security reasons. Assets themselves should be
145
- considered full scripting environments with filesystem access.
146
-
147
- **2.12.1** (April 17, 2014)
148
-
149
- * Fix making manifest target directory when its different than the output directory.
150
-
151
- **2.12.0** (March 13, 2014)
152
-
153
- * Avoid context reference in SassImporter hack so its Marshallable. Fixes
154
- issues with Sass 3.3.x.
155
-
156
- **2.11.0** (February 19, 2014)
157
-
158
- * Cache store must now be an LRU implementation.
159
- * Default digest changed to SHA1. To continue using MD5.
160
- `env.digest_class = Digest::MD5`.
161
-
162
- **2.10.0** (May 24, 2013)
163
-
164
- * Support for `bower.json`
165
-
166
- **2.9.3** (April 20, 2013)
167
-
168
- * Fixed sass caching bug
169
-
170
- **2.9.2** (April 8, 2013)
171
-
172
- * Improve file freshness check performance
173
- * Directive processor encoding fixes
174
-
175
- **2.9.1** (April 6, 2013)
176
-
177
- * Support for Uglifier 2.x
178
-
179
- **2.9.0** (February 25, 2013)
180
-
181
- * Write out gzipped variants of bundled assets.
182
-
183
- **2.8.2** (December 10, 2012)
184
-
185
- * Fixed top level Sass constant references
186
- * Fixed manifest logger when environment is disabled
187
-
188
- **2.8.1** (October 31, 2012)
189
-
190
- * Fixed Sass importer bug
191
-
192
- **2.8.0** (October 16, 2012)
193
-
194
- * Allow manifest location to be separated from output directory
195
- * Pass logical path and absolute path to each_logical_path iterator
196
-
197
- **2.7.0** (October 10, 2012)
198
-
199
- * Added --css-compressor and --js-compressor command line flags
200
- * Added css/js compressor shorthand
201
- * Change default manifest.json filename to be a randomized manifest-16HEXBYTES.json
202
- * Allow nil environment to be passed to manifest
203
- * Allow manifest instance to be set on rake task
204
-
205
- **2.6.0** (September 19, 2012)
206
-
207
- * Added bower component.json require support
208
-
209
- **2.5.0** (September 4, 2012)
210
-
211
- * Fixed Ruby 2.0 RegExp warning
212
- * Provide stubbed implementation of context *_path helpers
213
- * Add SassCompressor
214
-
215
- **2.4.5** (July 10, 2012)
216
-
217
- * Tweaked some logger levels
218
-
219
- **2.4.4** (July 2, 2012)
220
-
221
- * Canonicalize logical path extensions
222
- * Check absolute paths passed to depend_on
223
-
224
- **2.4.3** (May 16, 2012)
225
-
226
- * Exposed :sprockets in sass options
227
- * Include dependency paths in asset mtime
228
-
229
- **2.4.2** (May 7, 2012)
230
-
231
- * Fixed MultiJson feature detect
232
-
233
- **2.4.1** (April 26, 2012)
234
-
235
- * Fixed MultiJson API change
236
- * Fixed gzip mtime
237
-
238
- **2.4.0** (March 27, 2012)
239
-
240
- * Added global path registry
241
- * Added global processor registry
242
-
243
- **2.3.2** (March 26, 2012)
244
-
245
- * Fix Context#logical_path with dots
246
-
247
- **2.3.1** (February 11, 2012)
248
-
249
- * Added bytesize to manifest
250
- * Added Asset#bytesize alias
251
- * Security: Check path for forbidden access after unescaping
252
-
253
- **2.3.0** (January 16, 2012)
254
-
255
- * Added special Sass importer that automatically tracks any `@import`ed files.
256
-
257
- **2.2.0** (January 10, 2012)
258
-
259
- * Added `sprockets` command line utility.
260
- * Added rake/sprocketstask.
261
- * Added json manifest log of compiled assets.
262
- * Added `stub` directive that allows you to exclude files from the bundle.
263
- * Added per environment external encoding (Environment#default_external_encoding). Defaults to UTF-8. Fixes issues where LANG is not set correctly and Rubys default external is set to ASCII.
264
-
265
- **2.1.2** (November 20, 2011)
266
-
267
- * Disabled If-Modified-Since server checks. Fixes some browser caching issues when serving the asset body only. If-None-Match caching is sufficient.
268
-
269
- **2.1.1** (November 18, 2011)
270
-
271
- * Fix windows absolute path check bug.
272
-
273
- **2.1.0** (November 11, 2011)
274
-
275
- * Directive comment lines are now turned into empty lines instead of removed. This way line numbers in
276
- CoffeeScript syntax errors are correct.
277
- * Performance and caching bug fixes.
278
-
279
- **2.0.3** (October 17, 2011)
280
-
281
- * Detect format extensions from right to left.
282
- * Make JST namespace configurable.
283
-
284
- **2.0.2** (October 4, 2011)
285
-
286
- * Fixed loading stale cache from bundler gems.
287
-
288
- **2.0.1** (September 30, 2011)
289
-
290
- * Fixed bug with fingerprinting file names with multiple dots.
291
- * Decode URIs as default internal.
292
- * Fix symlinked asset directories.
293
-
294
- **2.0.0** (August 29, 2011)
295
-
296
- * Initial public release.
76
+ Please upgrade to the latest Sprockets 3 version before upgrading to Sprockets 4. Check the 3.x branch for previous changes https://github.com/rails/sprockets/blob/3.x/CHANGELOG.md.
data/README.md CHANGED
@@ -5,7 +5,6 @@ It features declarative dependency management for JavaScript and CSS
5
5
  assets, as well as a powerful preprocessor pipeline that allows you to
6
6
  write assets in languages like CoffeeScript, Sass and SCSS.
7
7
 
8
-
9
8
  ## Installation
10
9
 
11
10
  Install Sprockets from RubyGems:
@@ -17,493 +16,650 @@ $ gem install sprockets
17
16
  Or include it in your project's `Gemfile` with Bundler:
18
17
 
19
18
  ``` ruby
20
- gem 'sprockets', '~> 3.0'
19
+ gem 'sprockets', '~> 4.0'
21
20
  ```
22
21
 
23
- ## Using sprockets
22
+ ## Upgrading to Sprockets 4.x
24
23
 
25
- For most people interested in using sprockets you will want to see [End User Asset Generation](guides/end_user_asset_generation.md) guide. This contains information about sprocket's directive syntax, and default processing behavior.
24
+ These are the major features in Sprockets 4.x
26
25
 
27
- If you are a framework developer that is using sprockets, see [Building an Asset Processing Framework](guides/building_an_asset_processing_framework.md).
26
+ - Source Maps
27
+ - Manifest.js
28
+ - ES6 support
29
+ - Deprecated processor interface in 3.x is removed in 4.x
28
30
 
29
- If you are a library developer who is extending the functionality of sprockets, see [Extending Sprockets](guides/extending_sprockets.md).
31
+ Read more about them by referencing [Upgrading document](UPGRADING.md)
30
32
 
31
- Below is a disjointed mix of documentation for all three of these roles. Eventually they will be moved to an appropriate guide, for now the recommended way to consume documentation is to view the appropriate guide first and then supplement with docs from the README.
33
+ ## Guides
32
34
 
33
- ## Behavior
35
+ For most people interested in using Sprockets, you will want to see the README below.
34
36
 
35
- ### Index files are proxies for folders
37
+ If you are a framework developer that is using Sprockets, see [Building an Asset Processing Framework](guides/building_an_asset_processing_framework.md).
36
38
 
37
- In sprockets index files such as `index.js` or `index.css` files inside of a folder will generate a file with the folder's name. So if you have a `foo/index.js` file it will compile down to `foo.js`. This is similar to NPM's behavior of using [folders as modules](https://nodejs.org/api/modules.html#modules_folders_as_modules). It is also somewhat similar to the way that a file in `public/my_folder/index.html` can be reached by a request to `/my_folder`. This means that you cannot directly use an index file. For example this would not work:
39
+ If you are a library developer who is extending the functionality of Sprockets, see [Extending Sprockets](guides/extending_sprockets.md).
38
40
 
39
- ```
40
- <%= asset_path("foo/index.js") %>
41
- ```
41
+ If you want to work on Sprockets or better understand how it works read [How Sprockets Works](guides/how_sprockets_works.md)
42
42
 
43
- Instead you would need to use:
43
+ ## Behavior Overview
44
44
 
45
- ```
46
- <%= asset_path("foo.js") %>
47
- ```
45
+ You can interact with Sprockets primarily through directives and file extensions. This section covers how to use each of these things, and the defaults that ship with Sprockets.
48
46
 
49
- Why would you want to use this behavior? It is common behavior where you might want to include an entire directory of files in a top level javascript. You can do this in sprockets using `require_tree .`
47
+ Since you are likely using Sprockets through another framework (such as the [the Rails asset pipeline](http://guides.rubyonrails.org/asset_pipeline.html)), there will be configuration options you can toggle that will change behavior such as what directories or files get compiled. For that documentation you should see your framework's documentation.
50
48
 
51
- ```
52
- //= require_tree .
53
- ```
49
+ #### Accessing Assets
54
50
 
55
- This has the problem that files are required alphabetically. If your directory has `jquery-ui.js` and `jquery.min.js` then sprockets will require `jquery-ui.js` before `jquery` is required which won't work (because jquery-ui depends on jquery). Previously the only way to get the correct ordering would be to rename your files, something like `0-jquery-ui.js`. Instead of doing that you can use an index file.
51
+ Assets in Sprockets are always referenced by their *logical path*.
56
52
 
57
- For example, if you have an `application.js` and want all the files in the `foo/` folder you could do this:
53
+ The logical path is the path of the asset source file relative to its
54
+ containing directory in the load path. For example, if your load path
55
+ contains the directory `app/assets/javascripts`:
58
56
 
59
- ```
60
- //= require foo.js
57
+ <table>
58
+ <tr>
59
+ <th>Logical path</th>
60
+ <th>Source file on disk</th>
61
+ </tr>
62
+ <tr>
63
+ <td>application.js</td>
64
+ <td>app/assets/javascripts/application.js</td>
65
+ </tr>
66
+ <tr>
67
+ <td>models/project.js</td>
68
+ <td>app/assets/javascripts/models/project.js</td>
69
+ </tr>
70
+ <tr>
71
+ <td>hello.js</td>
72
+ <td>app/assets/javascripts/hello.coffee</td>
73
+ </tr>
74
+ </table>
75
+
76
+ > Note: For assets that are compiled or transpiled, you want to specify the extension that you want, not the extension on disk. For example we specified `hello.js` even if the file on disk is a coffeescript file, since the asset it will generate is javascript.
77
+
78
+ ### Directives
79
+
80
+ Directives are special comments in your asset file and the main way of interacting with processors. What kind of interactions? You can use these directives to tell Sprockets to load other files, or specify dependencies on other assets.
81
+
82
+ For example, let's say you have custom JavaScript that you've written. You put this javascript in a file called `beta.js`. The javascript makes heavy use of jQuery, so you need to load that before your code executes. You could add a `require` directive to the top of `beta.js`:
83
+
84
+ ```js
85
+ //= require jquery
86
+
87
+ $().ready({
88
+ // my custom code here
89
+ })
61
90
  ```
62
91
 
63
- Then create a file `foo/index.js` that requires all the files in that folder in any order you want:
92
+ The directive processor understands comment blocks in three formats:
64
93
 
94
+ ``` css
95
+ /* Multi-line comment blocks (CSS, SCSS, JavaScript)
96
+ *= require foo
97
+ */
65
98
  ```
66
- //= require foo.min.js
67
- //= require foo-ui.js
99
+
100
+ ``` js
101
+ // Single-line comment blocks (SCSS, JavaScript)
102
+ //= require foo
68
103
  ```
69
104
 
70
- Now in your `application.js` will correctly load the `foo.min.js` before `foo-ui.js`. If you used `require_tree` it would not work correctly.
105
+ ``` coffee
106
+ # Single-line comment blocks (CoffeeScript)
107
+ #= require foo
108
+ ```
71
109
 
72
- ## Understanding the Sprockets Environment
110
+ > Note: Directives are only processed if they come before any application code. Once you have a line that does not include a comment or whitespace then Sprockets will stop looking for directives. If you use a directive outside of the "header" of the document it will not do anything, and won't raise any errors.
73
111
 
74
- You'll need an instance of the `Sprockets::Environment` class to
75
- access and serve assets from your application. Under Rails 4.0 and
76
- later, `YourApp::Application.assets` is a preconfigured
77
- `Sprockets::Environment` instance. For Rack-based applications, create
78
- an instance in `config.ru`.
112
+ Here is a list of the available directives:
79
113
 
80
- The Sprockets `Environment` has methods for retrieving and serving
81
- assets, manipulating the load path, and registering processors. It is
82
- also a Rack application that can be mounted at a URL to serve assets
83
- over HTTP.
114
+ - [`require`](#require) - Add the contents of a file to current
115
+ - [`require_self`](#require_self) - Change order of where current contents are concatenated to current
116
+ - [`require_directory`](#require_directory) - Add contents of each file in a folder to current
117
+ - [`require_tree`](#require_tree) - Add contents of all files in all directories in a path to current
118
+ - [`link`](#link) - Make target file compile and be publicly available without adding contents to current
119
+ - [`link_directory`](#link_directory) - Make target directory compile and be publicly available without adding contents to current
120
+ - [`link_tree`](#link_tree) - Make target tree compile and be publicly available without adding contents to current
121
+ - [`depend_on`](#depend_on) - Recompile current file if target has changed
122
+ - [`stub`](#stub) - Ignore target file
84
123
 
85
- ### The Load Path
124
+ You can see what each of these does below.
86
125
 
87
- The *load path* is an ordered list of directories that Sprockets uses
88
- to search for assets.
126
+ ### Specifying Processors through File Extensions
89
127
 
90
- In the simplest case, a Sprockets environment's load path will consist
91
- of a single directory containing your application's asset source
92
- files. When mounted, the environment will serve assets from this
93
- directory as if they were static files in your public root.
128
+ Sprockets uses the filename extensions to determine what processors to run on your file and in what order. For example if you have a file:
94
129
 
95
- The power of the load path is that it lets you organize your source
96
- files into multiple directories -- even directories that live outside
97
- your application -- and combine those directories into a single
98
- virtual filesystem. That means you can easily bundle JavaScript, CSS
99
- and images into a Ruby library or [Bower](http://bower.io) package and import them into your application.
130
+ ```
131
+ application.scss
132
+ ```
100
133
 
101
- #### Manipulating the Load Path
134
+ Then Sprockets will by default run the sass processor (which implements scss). The output file will be converted to css.
102
135
 
103
- To add a directory to your environment's load path, use the
104
- `append_path` and `prepend_path` methods. Directories at the beginning
105
- of the load path have precedence over subsequent directories.
136
+ You can specify multiple processors by specifying multiple file extensions. For example you can use Ruby's [ERB template language](#invoking-ruby-with-erb) to embed content in your doc before running the sass processor. To accomplish this you would need to name your file
106
137
 
107
- ``` ruby
108
- environment = Sprockets::Environment.new
109
- environment.append_path 'app/assets/javascripts'
110
- environment.append_path 'lib/assets/javascripts'
111
- environment.append_path 'vendor/assets/bower_components'
138
+ ```
139
+ application.scss.erb
112
140
  ```
113
141
 
114
- In general, you should append to the path by default and reserve
115
- prepending for cases where you need to override existing assets.
142
+ Processors are run from right to left (tail to head), so in the above example the processor associated with `erb` will be run before the processor associated with `scss` extension.
116
143
 
117
- ### Accessing Assets
144
+ For a description of the processors that Sprockets has by default see the "default processors" section below. Other libraries may register additional processors.
118
145
 
119
- Once you've set up your environment's load path, you can mount the
120
- environment as a Rack server and request assets via HTTP. You can also
121
- access assets programmatically from within your application.
146
+ When "asking" for a compiled file, you always ask for the extension you want. For example if you're using Rails, to get the contents of `application.scss.erb` you would use
122
147
 
123
- #### Logical Paths
148
+ ```
149
+ asset_path("application.css")
150
+ ```
124
151
 
125
- Assets in Sprockets are always referenced by their *logical path*.
152
+ Sprockets understands that `application.scss.erb` will compile down to a `application.css`. Ask for what you need, not what you have.
126
153
 
127
- The logical path is the path of the asset source file relative to its
128
- containing directory in the load path. For example, if your load path
129
- contains the directory `app/assets/javascripts`:
154
+ If this isn't working like you expect, make sure you didn't typo an extension, and make sure the file is on a "load path" (see framework docs for adding new load paths).
130
155
 
131
- <table>
132
- <tr>
133
- <th>Asset source file</th>
134
- <th>Logical path</th>
135
- </tr>
136
- <tr>
137
- <td>app/assets/javascripts/application.js</td>
138
- <td>application.js</td>
139
- </tr>
140
- <tr>
141
- <td>app/assets/javascripts/models/project.js</td>
142
- <td>models/project.js</td>
143
- </tr>
144
- </table>
156
+ ## File Order Processing
145
157
 
146
- In this way, all directories in the load path are merged to create a
147
- virtual filesystem whose entries are logical paths.
158
+ By default files are processed in alphabetical order. This behavior can impact your asset compilation when one asset needs to be loaded before another.
148
159
 
149
- #### Serving Assets Over HTTP
160
+ For example if you have an `application.js` and it loads another directory
150
161
 
151
- When you mount an environment, all of its assets are accessible as
152
- logical paths underneath the *mount point*. For example, if you mount
153
- your environment at `/assets` and request the URL
154
- `/assets/application.js`, Sprockets will search your load path for the
155
- file named `application.js` and serve it.
162
+ ```js
163
+ //= require_directory my_javascript
164
+ ```
156
165
 
157
- Under Rails 4.0 and later, your Sprockets environment is automatically
158
- mounted at `/assets`. If you are using Sprockets with a Rack
159
- application, you will need to mount the environment yourself. A good
160
- way to do this is with the `map` method in `config.ru`:
166
+ The files in that directory will be loaded in alphabetical order. If the directory looks like this:
161
167
 
162
- ``` ruby
163
- require 'sprockets'
164
- map '/assets' do
165
- environment = Sprockets::Environment.new
166
- environment.append_path 'app/assets/javascripts'
167
- environment.append_path 'app/assets/stylesheets'
168
- run environment
169
- end
168
+ ```sh
169
+ $ ls -1 my_javascript/
170
+
171
+ alpha.js
172
+ beta.js
173
+ jquery.js
174
+ ```
175
+
176
+ Then `alpha.js` will be loaded before either of the other two. This can be a problem if `alpha.js` uses jquery. For this reason it is not recommend to use `require_directory` with files that are ordering dependent. You can either require individual files manually:
170
177
 
171
- map '/' do
172
- run YourRackApp
173
- end
178
+ ```js
179
+ //= require jquery
180
+ //= require alpha
181
+ //= require beta
174
182
  ```
175
183
 
176
- #### Accessing Assets Programmatically
184
+ Or you can use index files to proxy your folders.
177
185
 
178
- You can use the `find_asset` method (aliased as `[]`) to retrieve an
179
- asset from a Sprockets environment. Pass it a logical path and you'll
180
- get a `Sprockets::Asset` instance back:
186
+ ### Index files are proxies for folders
181
187
 
182
- ``` ruby
183
- environment['application.js']
184
- # => #<Sprockets::Asset ...>
188
+ In Sprockets index files such as `index.js` or `index.css` files inside of a folder will generate a file with the folder's name. So if you have a `foo/index.js` file it will compile down to `foo.js`. This is similar to NPM's behavior of using [folders as modules](https://nodejs.org/api/modules.html#modules_folders_as_modules). It is also somewhat similar to the way that a file in `public/my_folder/index.html` can be reached by a request to `/my_folder`. This means that you cannot directly use an index file. For example this would not work:
189
+
190
+ ```erb
191
+ <%= asset_path("foo/index.js") %>
185
192
  ```
186
193
 
187
- Call `to_s` on the resulting asset to access its contents, `length` to
188
- get its length in bytes, `mtime` to query its last-modified time, and
189
- `filename` to get its full path on the filesystem.
194
+ Instead you would need to use:
190
195
 
196
+ ```erb
197
+ <%= asset_path("foo.js") %>
198
+ ```
191
199
 
192
- ## Using Processors
200
+ Why would you want to use this behavior? It is common behavior where you might want to include an entire directory of files in a top level JavaScript. You can do this in Sprockets using `require_tree .`
193
201
 
194
- Asset source files can be written in another format, like SCSS or
195
- CoffeeScript, and automatically compiled to CSS or JavaScript by
196
- Sprockets. Processors that convert a file from one format to another are called *transformers*.
202
+ ```js
203
+ //= require_tree .
204
+ ```
197
205
 
198
- ### Minifying Assets
206
+ This has the problem that files are required alphabetically. If your directory has `jquery-ui.js` and `jquery.min.js` then Sprockets will require `jquery-ui.js` before `jquery` is required which won't work (because jquery-ui depends on jquery). Previously the only way to get the correct ordering would be to rename your files, something like `0-jquery-ui.js`. Instead of doing that you can use an index file.
199
207
 
200
- Several JavaScript and CSS minifiers are available through shorthand.
208
+ For example, if you have an `application.js` and want all the files in the `foo/` folder you could do this:
201
209
 
202
- ``` ruby
203
- environment.js_compressor = :uglify
204
- environment.css_compressor = :scss
210
+ ```js
211
+ //= require foo.js
205
212
  ```
206
213
 
207
- ### Styling with Sass and SCSS
214
+ Then create a file `foo/index.js` that requires all the files in that folder in any order you want using relative references:
208
215
 
209
- [Sass](http://sass-lang.com/) is a language that compiles to CSS and
210
- adds features like nested rules, variables, mixins and selector
211
- inheritance.
216
+ ```js
217
+ //= require ./foo.min.js
218
+ //= require ./foo-ui.js
219
+ ```
212
220
 
213
- If the `sass` gem is available to your application, you can use Sass
214
- to write CSS assets in Sprockets.
221
+ Now in your `application.js` will correctly load the `foo.min.js` before `foo-ui.js`. If you used `require_tree` it would not work correctly.
215
222
 
216
- Sprockets supports both Sass syntaxes. For the original
217
- whitespace-sensitive syntax, use the extension `.sass`. For the
218
- new SCSS syntax, use the extension `.scss`.
223
+ ## Cache
219
224
 
220
- ### Scripting with CoffeeScript
225
+ Compiling assets is slow. It requires a lot of disk use to pull assets off of hard drives, a lot of RAM to manipulate those files in memory, and a lot of CPU for compilation operations. Because of this Sprockets has a cache to speed up asset compilation times. That's the good news. The bad news, is that sprockets has a cache and if you've found a bug it's likely going to involve the cache.
221
226
 
222
- [CoffeeScript](http://jashkenas.github.com/coffee-script/) is a
223
- language that compiles to the "good parts" of JavaScript, featuring a
224
- cleaner syntax with array comprehensions, classes, and function
225
- binding.
227
+ By default Sprockets uses the file system to cache assets. It makes sense that Sprockets does not want to generate assets that already exist on disk in `public/assets`, what might not be as intuitive is that Sprockets needs to cache "partial" assets.
226
228
 
227
- If the `coffee-script` gem is available to your application, you can
228
- use CoffeeScript to write JavaScript assets in Sprockets. Note that
229
- the CoffeeScript compiler is written in JavaScript, and you will need
230
- an [ExecJS](https://github.com/rails/execjs)-supported runtime
231
- on your system to invoke it.
229
+ For example if you have an `application.js` and it is made up of `a.js`, `b.js`, all the way to `z.js`
232
230
 
233
- To write JavaScript assets with CoffeeScript, use the extension
234
- `.coffee`.
231
+ ```js
232
+ //= require a.js
233
+ //= require b.js
234
+ # ...
235
+ //= require z.js
236
+ ```
235
237
 
236
- ### JavaScript Templating with EJS and Eco
238
+ The first time this file is compiled the `application.js` output will be written to disk, but also intermediary compiled files for `a.js` etc. will be written to the cache directory (usually `tmp/cache/assets`).
237
239
 
238
- Sprockets supports *JavaScript templates* for client-side rendering of
239
- strings or markup. JavaScript templates have the special format
240
- extension `.jst` and are compiled to JavaScript functions.
240
+ So, if `b.js` changes it will get recompiled. However instead of having to recompile the other files from `a.js` to `z.js` since they did not change, we can use the prior intermediary files stored in the cached values . If these files were expensive to generate, then this "partial" asset cache strategy can save a lot of time.
241
241
 
242
- When loaded, a JavaScript template function can be accessed by its
243
- logical path as a property on the global `JST` object. Invoke a
244
- template function to render the template as a string. The resulting
245
- string can then be inserted into the DOM.
242
+ Directives such as `require`, `link`, and `depend_on` tell Sprockets what assets need to be re-compiled when a file changes. Files are considered "fresh" based on their mtime on disk and a combination of cache keys.
246
243
 
247
- ```
248
- <!-- templates/hello.jst.ejs -->
249
- <div>Hello, <span><%= name %></span>!</div>
244
+ On Rails you can force a "clean" install by clearing the `public/assets` and `tmp/cache/assets` directories.
250
245
 
251
- // application.js
252
- //= require templates/hello
253
- $("#hello").html(JST["templates/hello"]({ name: "Sam" }));
246
+
247
+ ## Default Directives
248
+
249
+ Directives take a path or a path to a file. Paths for directive can be relative to the current file, for example:
250
+
251
+ ```js
252
+ //= require ../foo.js
254
253
  ```
255
254
 
256
- Sprockets supports two JavaScript template languages:
257
- [EJS](https://github.com/sstephenson/ruby-ejs), for embedded
258
- JavaScript, and [Eco](https://github.com/sstephenson/ruby-eco), for
259
- embedded CoffeeScript. Both languages use the familiar `<% … %>`
260
- syntax for embedding logic in templates.
255
+ This would load the file up one directory and named `foo.js`. However this isn't required if `foo.js` is on one of Sprocket's load paths. You can simply use
261
256
 
262
- If the `ejs` gem is available to your application, you can use EJS
263
- templates in Sprockets. EJS templates have the extension `.jst.ejs`.
257
+ ```js
258
+ //= require foo.js
259
+ ```
264
260
 
265
- If the `eco` gem is available to your application, you can use [Eco
266
- templates](https://github.com/sstephenson/eco) in Sprockets. Eco
267
- templates have the extension `.jst.eco`. Note that the `eco` gem
268
- depends on the CoffeeScript compiler, so the same caveats apply as
269
- outlined above for the CoffeeScript engine.
261
+ Without any prepended dots and sprockets will search for the asset. If the asset is on a sub-path of the load path, you can specify it without using a relative path as well:
270
262
 
271
- ### Invoking Ruby with ERB
263
+ ```js
264
+ //= require sub/path/foo.js
265
+ ```
272
266
 
273
- Sprockets provides an ERB engine for preprocessing assets using
274
- embedded Ruby code. Append `.erb` to a CSS or JavaScript asset's
275
- filename to enable the ERB engine.
267
+ You can also use an absolute path, but this is discouraged unless you know the directory structure of every machine you plan on running code on.
276
268
 
277
- Ruby code embedded in an asset is evaluated in the context of a
278
- `Sprockets::Context` instance for the given asset. Common uses for ERB
279
- include:
269
+ Below is a section for each of the built in directive types supported by Sprockets.
280
270
 
281
- - embedding another asset as a Base64-encoded `data:` URI with the
282
- `asset_data_uri` helper
283
- - inserting the URL to another asset, such as with the `asset_path`
284
- helper provided by the Sprockets Rails plugin
285
- - embedding other application resources, such as a localized string
286
- database, in a JavaScript asset via JSON
287
- - embedding version constants loaded from another file
271
+ ### require
288
272
 
289
- See the [Helper Methods](lib/sprockets/context.rb) section for more information about
290
- interacting with `Sprockets::Context` instances via ERB.
273
+ `require` *path* inserts the contents of the asset source file
274
+ specified by *path*. If the file is required multiple times, it will
275
+ appear in the bundle only once.
291
276
 
277
+ **Example:**
292
278
 
293
- ## Managing and Bundling Dependencies
279
+ If you've got an `a.js`:
294
280
 
295
- You can create *asset bundles* -- ordered concatenations of asset
296
- source files -- by specifying dependencies in a special comment syntax
297
- at the top of each source file.
281
+ ```js
282
+ var a = "A";
283
+ ```
298
284
 
299
- Sprockets reads these comments, called *directives*, and processes
300
- them to recursively build a dependency graph. When you request an
301
- asset with dependencies, the dependencies will be included in order at
302
- the top of the file.
285
+ and a `b.js`;
303
286
 
304
- ### The Directive Processor
287
+ ```js
288
+ var b = "B";
289
+ ```
305
290
 
306
- Sprockets runs the *directive processor* on each CSS and JavaScript
307
- source file. The directive processor scans for comment lines beginning
308
- with `=` in comment blocks at the top of the file.
291
+ Then you could require both of these in an `application.js`
309
292
 
310
- ``` js
311
- //= require jquery
312
- //= require jquery-ui
313
- //= require backbone
314
- //= require_tree .
293
+ ```js
294
+ //= require a.js
295
+ //= require b.js
315
296
  ```
316
297
 
317
- The first word immediately following `=` specifies the directive
318
- name. Any words following the directive name are treated as
319
- arguments. Arguments may be placed in single or double quotes if they
320
- contain spaces, similar to commands in the Unix shell.
298
+ Which would generate one concatenated file:
321
299
 
322
- **Note**: Non-directive comment lines will be preserved in the final
323
- asset, but directive comments are stripped after
324
- processing. Sprockets will not look for directives in comment blocks
325
- that occur after the first line of code.
300
+ ```js
301
+ var a = "A";
302
+ var b = "B";
303
+ ```
326
304
 
327
- #### Supported Comment Types
305
+ ### require_self
328
306
 
329
- The directive processor understands comment blocks in three formats:
307
+ `require_self` tells Sprockets to insert the body of the current
308
+ source file before any subsequent `require` directives.
330
309
 
331
- ``` css
332
- /* Multi-line comment blocks (CSS, SCSS, JavaScript)
333
- *= require foo
334
- */
335
- ```
310
+ **Example:**
336
311
 
337
- ``` js
338
- // Single-line comment blocks (SCSS, JavaScript)
339
- //= require foo
340
- ```
312
+ If you've got an `a.js`:
341
313
 
342
- ``` coffee
343
- # Single-line comment blocks (CoffeeScript)
344
- #= require foo
314
+ ```js
315
+ var a = "A";
345
316
  ```
346
317
 
347
- ### Sprockets Directives
318
+ And an `application.js`
348
319
 
349
- You can use the following directives to declare dependencies in asset
350
- source files.
320
+ ```js
321
+ //= require_self
322
+ //= require 'a.js'
351
323
 
352
- For directives that take a *path* argument, you may specify either a
353
- logical path or a relative path. Relative paths begin with `./` and
354
- reference files relative to the location of the current file.
324
+ var app_name = "Sprockets";
325
+ ```
355
326
 
356
- #### The `require` Directive
327
+ Then this will take the contents of `application.js` (that come after the last require) and put them at the beginning of the file:
357
328
 
358
- `require` *path* inserts the contents of the asset source file
359
- specified by *path*. If the file is required multiple times, it will
360
- appear in the bundle only once.
329
+ ```js
330
+ var app_name = "Sprockets";
331
+ var a = "A";
332
+ ```
361
333
 
362
- ### The `require_directory` Directive ###
334
+ ### require_directory
363
335
 
364
336
  `require_directory` *path* requires all source files of the same
365
337
  format in the directory specified by *path*. Files are required in
366
338
  alphabetical order.
367
339
 
368
- #### The `require_tree` Directive
340
+ **Example:**
341
+
342
+ If we've got a directory called `alphabet` with an `a.js` and `b.js` files like before, then our `application.js`
343
+
344
+ ```js
345
+ //= require_directory alphabet
346
+ ```
347
+
348
+ Would produce:
349
+
350
+ ```js
351
+ var a = "A";
352
+ var b = "B";
353
+ ```
354
+
355
+ You can also see [Index files are proxies for folders](#index-files-are-proxies-for-folders) for another method of organizing folders that will give you more control.
356
+
357
+ ### require_tree
369
358
 
370
359
  `require_tree` *path* works like `require_directory`, but operates
371
360
  recursively to require all files in all subdirectories of the
372
361
  directory specified by *path*.
373
362
 
374
- #### The `require_self` Directive
375
-
376
- `require_self` tells Sprockets to insert the body of the current
377
- source file before any subsequent `require` directives.
378
-
379
- #### The `link` Directive
363
+ ### link
380
364
 
381
365
  `link` *path* declares a dependency on the target *path* and adds it to a list
382
- of subdependencies to automatically be compiled when the asset is written out to
366
+ of subdependencies to be compiled when the asset is written out to
383
367
  disk.
384
368
 
385
- For an example, in a CSS file you might reference an external image that always
386
- needs to be compiled along with the css file.
369
+ Example:
387
370
 
388
- ``` css
389
- /*= link "logo.png" */
390
- .logo {
391
- background-image: url(logo.png)
392
- }
371
+ If you've got a `manifest.js` file and you want to specify that a `admin.js` source file should be
372
+ generated and made available to the public you can link it by including this in the `manifest.js` file:
373
+
374
+ ```
375
+ //= link admin.js
393
376
  ```
394
377
 
395
- However, if you use a `asset-path` or `asset-url` SCSS helper, these links will
396
- automatically be defined for you.
378
+ The argument to `link` is a _logical path_, that is it will be resolved according to the
379
+ configured asset load paths. See [Accesing Assets](#accessing-assets) above. A path relative to
380
+ the current file won't work, it must be a logical path.
397
381
 
398
- ``` css
399
- .logo {
400
- background-image: asset-url("logo.png")
401
- }
382
+ **Caution**: the "link" directive should always have an explicit extension on the end.
383
+
384
+ ### link_directory
385
+
386
+ `link_directory` *path* links all the files inside the directory specified by the *path*. By "link", we mean they are specified as compilation targets to be written out to disk, and made available to be served to user-agents.
387
+
388
+ Files in subdirectories will not be linked (Compare to [link_tree](#link_tree)).
389
+
390
+ The *path* argument to `link_directory` is _not_ a logical path (it does not use the asset load paths), but is a path relative to the file the `link_directory` directive is found in, and can use `..` to . For instance, you might want:
391
+
392
+ ```js
393
+ //= link_directory ../stylesheets
394
+ ```
395
+
396
+ `link_directory` can take an optional second argument with an extension or content-type, with the
397
+ two arguments separated by a space:
398
+
399
+ ```js
400
+ //= link_directory ../stylesheets text/css
401
+ //= link_directory ../more_stylesheets .css
402
+ ```
403
+
404
+ This will limit the matching files to link to only files recognized as that type. An extension is
405
+ just a shortcut for the type referenced, it does not need to match the source file exactly, but
406
+ instead identifies the content-type the source file must be recognized as.
407
+
408
+ ### link_tree
409
+
410
+ `link_tree` *path* works like [link_directory](#link_directory), but operates
411
+ recursively to link all files in all subdirectories of the
412
+ directory specified by *path*.
413
+
414
+ Example:
415
+
416
+ ```js
417
+ //= link_tree ./path/to/folder
418
+ ```
419
+
420
+ Like `link_directory`, the argument is path relative to the current file, it is *not* a 'logical path' tresolved against load paths.
421
+
422
+
423
+ As with `link_directory`, you can also specify a second argument -- separated by a space -- so any extra files not matching the content-type specified will be ignored:
424
+
425
+ ```js
426
+ //= link_tree ./path/to/folder text/javascript
427
+ //= link_tree ./path/to/other_folder .js
402
428
  ```
403
429
 
404
- #### The `depend_on` Directive
430
+
431
+ ### depend_on
405
432
 
406
433
  `depend_on` *path* declares a dependency on the given *path* without
407
434
  including it in the bundle. This is useful when you need to expire an
408
435
  asset's cache in response to a change in another file.
409
436
 
410
- #### The `depend_on_asset` Directive
437
+ **Example:**
438
+
439
+ If you have a file such as `bar.data` and you're using data from that file in another file, then
440
+ you need to tell sprockets that it needs to re-compile the file if `bar.data` changes:
441
+
442
+ ```js
443
+ //= depend_on "bar.data"
444
+
445
+ var bar = '<%= File.read("bar.data") %>'
446
+ ```
447
+
448
+ ### depend_on_asset
411
449
 
412
450
  `depend_on_asset` *path* works like `depend_on`, but operates
413
451
  recursively reading the file and following the directives found. This is automatically implied if you use `link`, so consider if it just makes sense using `link` instead of `depend_on_asset`.
414
452
 
415
- #### The `stub` Directive
453
+ ### stub
416
454
 
417
- `stub` *path* allows dependency to be excluded from the asset bundle.
455
+ `stub` *path* excludes that asset and its dependencies from the asset bundle.
418
456
  The *path* must be a valid asset and may or may not already be part
419
457
  of the bundle. `stub` should only be used at the top level bundle, not
420
458
  within any subdependencies.
421
459
 
460
+ ### Invoking Ruby with ERB
422
461
 
423
- ## Processor Interface
462
+ Sprockets provides an ERB engine for preprocessing assets using
463
+ embedded Ruby code. Append `.erb` to a CSS or JavaScript asset's
464
+ filename to enable the ERB engine.
424
465
 
425
- Sprockets 2.x was originally design around [Tilt](https://github.com/rtomayko/tilt)'s engine interface. However, starting with 3.x, a new interface has been introduced deprecating Tilt.
466
+ For example if you have an `app/application/javascripts/app_name.js.erb`
467
+ you could have this in the template
426
468
 
427
- Similar to Rack, a processor is a any "callable" (an object that responds to `call`). This maybe a simple Proc or a full class that defines a `def self.call(input)` method. The `call` method accepts an `input` Hash and returns a Hash of metadata.
469
+ ```js
470
+ var app_name = "<%= ENV['APP_NAME'] %>";
471
+ ```
428
472
 
429
- Also see [`Sprockets::ProcessorUtils`](https://github.com/rails/sprockets/blob/master/lib/sprockets/processor_utils.rb) for public helper methods.
473
+ Generated files are cached. If you're using an `ENV` var then
474
+ when you change then ENV var the asset will be forced to
475
+ recompile. This behavior is only true for environment variables,
476
+ if you are pulling a value from somewhere else, such as a database,
477
+ must manually invalidate the cache to see the change.
430
478
 
431
- ### input Hash
479
+ If you're using Rails, there are helpers you can use such as `asset_url`
480
+ that will cause a recompile if the value changes.
432
481
 
433
- The `input` Hash defines the following public fields.
482
+ For example if you have this in your `application.css`
434
483
 
435
- * `:data` - String asset contents
436
- * `:environment` - Current `Sprockets::Environment` instance.
437
- * `:cache` - A `Sprockets::Cache` instance. See [`Sprockets::Cache#fetch`](https://github.com/rails/sprockets/blob/master/lib/sprockets/cache.rb).
438
- * `:uri` - String Asset URI.
439
- * `:filename` - String full path to original file.
440
- * `:load_path` - String current load path for filename.
441
- * `:name` - String logical path for filename.
442
- * `:content_type` - String content type of the output asset.
443
- * `:metadata` - Hash of processor metadata.
484
+ ``` css
485
+ .logo {
486
+ background: url(<%= asset_url("logo.png") %>)
487
+ }
488
+ ```
489
+
490
+ When you modify the `logo.png` on disk, it will force `application.css` to be
491
+ recompiled so that the fingerprint will be correct in the generated asset.
492
+
493
+ You can manually make sprockets depend on any other file that is generated
494
+ by sprockets by using the `depend_on` directive. Rails implements the above
495
+ feature by auto calling `depend_on` on the original asset when the `asset_url`
496
+ is used inside of an asset.
497
+
498
+ ### Styling with Sass and SCSS
499
+
500
+ [Sass](http://sass-lang.com/) is a language that compiles to CSS and
501
+ adds features like nested rules, variables, mixins and selector
502
+ inheritance.
503
+
504
+ If the `sass` gem is available to your application, you can use Sass
505
+ to write CSS assets in Sprockets.
506
+
507
+ Sprockets supports both Sass syntaxes. For the original
508
+ whitespace-sensitive syntax, use the extension `.sass`. For the
509
+ new SCSS syntax, use the extension `.scss`.
510
+
511
+ In Rails if you have `app/application/stylesheets/foo.scss` it can
512
+ be referenced with `<%= asset_path("foo.css") %>`. When referencing
513
+ an asset in Rails, always specify the extension you want. Sprockets will
514
+ convert `foo.scss` to `foo.css`.
515
+
516
+ ### Scripting with CoffeeScript
517
+
518
+ [CoffeeScript](http://jashkenas.github.io/coffeescript/) is a
519
+ language that compiles to the "good parts" of JavaScript, featuring a
520
+ cleaner syntax with array comprehensions, classes, and function
521
+ binding.
522
+
523
+ If the `coffee-script` gem is available to your application, you can
524
+ use CoffeeScript to write JavaScript assets in Sprockets. Note that
525
+ the CoffeeScript compiler is written in JavaScript, and you will need
526
+ an [ExecJS](https://github.com/rails/execjs)-supported runtime
527
+ on your system to invoke it.
528
+
529
+ To write JavaScript assets with CoffeeScript, use the extension
530
+ `.coffee`.
531
+
532
+ In Rails if you have `app/application/javascripts/foo.coffee` it can
533
+ be referenced with `<%= asset_path("foo.js") %>`. When referencing
534
+ an asset in Rails, always specify the extension you want. Sprockets will
535
+ convert `foo.coffee` to `foo.js`.
536
+
537
+
538
+ ## ES6 Support
539
+
540
+ Sprockets 4 ships with a Babel processor. This allows you to transpile ECMAScript6 to JavaScript just like you would transpile CoffeeScript to JavaScript. To use this, modify your Gemfile:
541
+
542
+ ```ruby
543
+ gem 'babel-transpiler'
544
+ ```
545
+
546
+ Any asset with the extension `es6` will be treated as an ES6 file:
547
+
548
+ ```es6
549
+ // app/assets/javascript/application.es6
550
+
551
+ var square = (n) => n * n
552
+
553
+ console.log(square);
554
+ ```
555
+
556
+ Start a Rails server in development mode and visit `localhost:3000/assets/application.js`, and this asset will be transpiled to JavaScript:
557
+
558
+ ```js
559
+ var square = function square(n) {
560
+ return n * n;
561
+ };
562
+
563
+ console.log(square);
564
+ ```
565
+
566
+
567
+ ### JavaScript Templating with EJS and Eco
568
+
569
+ Sprockets supports *JavaScript templates* for client-side rendering of
570
+ strings or markup. JavaScript templates have the special format
571
+ extension `.jst` and are compiled to JavaScript functions.
572
+
573
+ When loaded, a JavaScript template function can be accessed by its
574
+ logical path as a property on the global `JST` object. Invoke a
575
+ template function to render the template as a string. The resulting
576
+ string can then be inserted into the DOM.
444
577
 
445
- ``` ruby
446
- def self.call(input)
447
- input[:cache].fetch("my:cache:key:v1") do
448
- # Remove all semicolons from source
449
- input[:data].gsub(";", "")
450
- end
451
- end
452
578
  ```
579
+ <!-- templates/hello.jst.ejs -->
580
+ <div>Hello, <span><%= name %></span>!</div>
453
581
 
454
- ### return Hash
582
+ // application.js
583
+ //= require templates/hello
584
+ $("#hello").html(JST["templates/hello"]({ name: "Sam" }));
585
+ ```
586
+
587
+ Sprockets supports two JavaScript template languages:
588
+ [EJS](https://github.com/sstephenson/ruby-ejs), for embedded
589
+ JavaScript, and [Eco](https://github.com/sstephenson/ruby-eco), for
590
+ embedded CoffeeScript. Both languages use the familiar `<% … %>`
591
+ syntax for embedding logic in templates.
455
592
 
456
- The processor should return metadata `Hash`. With the exception of the `:data` key, the processor can store arbitrary JSON valid values in this Hash. The data will be stored and exposed on `Asset#metadata`.
593
+ If the `ejs` gem is available to your application, you can use EJS
594
+ templates in Sprockets. EJS templates have the extension `.jst.ejs`.
457
595
 
458
- The returned `:data` replaces the assets `input[:data]` to the next processor in the chain. Returning a `String` is shorthand for returning `{ data: str }`. And returning `nil` is shorthand for a no-op where the input data is not transformed, `{ data: input[:data] }`.
596
+ If the `eco` gem is available to your application, you can use [Eco
597
+ templates](https://github.com/sstephenson/eco) in Sprockets. Eco
598
+ templates have the extension `.jst.eco`. Note that the `eco` gem
599
+ depends on the CoffeeScript compiler, so the same caveats apply as
600
+ outlined above for the CoffeeScript engine.
459
601
 
460
- ### metadata
602
+ ### Minifying Assets
461
603
 
462
- The metadata Hash provides an open format for processors to extend the pipeline processor. Internally, built-in processors use it for passing data to each other.
604
+ Several JavaScript and CSS minifiers are available through shorthand.
463
605
 
464
- * `:required` - A `Set` of String Asset URIs that the Bundle processor should concatenate together.
465
- * `:stubbed` - A `Set` of String Asset URIs that will be omitted from the `:required` set.
466
- * `:links` - A `Set` of String Asset URIs that should be compiled along with this asset.
467
- * `:dependencies` - A `Set` of String Cache URIs that should be monitored for caching.
606
+ In Rails you will specify them with:
607
+
608
+ ```ruby
609
+ config.assets.js_compressor = :uglify
610
+ config.assets.css_compressor = :scss
611
+ ```
612
+
613
+ If you're not using Rails, configure this directly on the "environment".
468
614
 
469
615
  ``` ruby
470
- def self.call(input)
471
- # Any metadata may start off as nil, so initialize it the value
472
- required = Set.new(input[:metadata][:required])
616
+ environment.js_compressor = :uglify
617
+ environment.css_compressor = :scss
618
+ ```
473
619
 
474
- # Manually add "foo.js" asset uri to our bundle
475
- required << input[:environment].resolve("foo.js")
620
+ If you are using Sprockets directly with a Rack app, don't forget to add
621
+ the `uglifier` and `sass` gems to your Gemfile when using above options.
622
+
623
+ ### Gzip
624
+
625
+ By default when Sprockets generates a compiled asset file it will also produce a gzipped copy of that file. Sprockets only gzips non-binary files such as CSS, javascript, and SVG files.
626
+
627
+ For example if Sprockets is generating
476
628
 
477
- { required: required }
478
- end
629
+ ```
630
+ application-12345.css
479
631
  ```
480
632
 
633
+ Then it will also generate a compressed copy in
481
634
 
482
- ## Development
635
+ ```
636
+ application-12345.css.gz
637
+ ```
483
638
 
484
- ### Contributing
639
+ This behavior can be disabled, refer to your framework specific documentation.
485
640
 
486
- The Sprockets source code is [hosted on
487
- GitHub](https://github.com/rails/sprockets). You can check out a
488
- copy of the latest code using Git:
641
+ ### Serving Assets
489
642
 
490
- $ git clone https://github.com/rails/sprockets
643
+ In production you should generate your assets to a directory on disk and serve them either via Nginx or a feature like Rail's `config.public_file_server.enabled = true`.
491
644
 
492
- If you've found a bug or have a question, please open an issue on the
493
- [Sprockets issue
494
- tracker](https://github.com/rails/sprockets/issues). Or, clone
495
- the Sprockets repository, write a failing test case, fix the bug and
496
- submit a pull request.
645
+ On Rails you can generate assets by running:
497
646
 
498
- ### Version History
647
+ ```term
648
+ $ RAILS_ENV=production rake assets:precompile
649
+ ```
499
650
 
500
- Please see the [CHANGELOG](https://github.com/rails/sprockets/tree/master/CHANGELOG.md)
651
+ In development Rails will serve assets from `Sprockets::Server`.
501
652
 
502
- ## License
653
+ ## Contributing to Sprockets
503
654
 
504
- Copyright &copy; 2014 Sam Stephenson <<sstephenson@gmail.com>>
655
+ Sprockets is the work of hundreds of contributors. You're encouraged to submit pull requests, propose
656
+ features and discuss issues.
505
657
 
506
- Copyright &copy; 2014 Joshua Peek <<josh@joshpeek.com>>
658
+ See [CONTRIBUTING](CONTRIBUTING.md).
507
659
 
508
- Sprockets is distributed under an MIT-style license. See LICENSE for
509
- details.
660
+ ### Version History
661
+
662
+ Please see the [CHANGELOG](https://github.com/rails/sprockets/tree/master/CHANGELOG.md)
663
+
664
+ ## License
665
+ Sprockets is released under the [MIT License](MIT-LICENSE).