hanami-assets 1.3.5 → 2.1.0.beta2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/CHANGELOG.md +22 -0
- data/README.md +92 -314
- data/hanami-assets.gemspec +26 -33
- data/lib/hanami/assets/asset.rb +83 -0
- data/lib/hanami/assets/base_url.rb +64 -0
- data/lib/hanami/assets/config.rb +106 -0
- data/lib/hanami/assets/errors.rb +46 -0
- data/lib/hanami/assets/version.rb +2 -2
- data/lib/hanami/assets.rb +61 -143
- data/lib/hanami-assets.rb +3 -0
- metadata +33 -115
- data/lib/hanami/assets/bundler/asset.rb +0 -100
- data/lib/hanami/assets/bundler/compressor.rb +0 -63
- data/lib/hanami/assets/bundler/manifest_entry.rb +0 -64
- data/lib/hanami/assets/bundler.rb +0 -154
- data/lib/hanami/assets/cache.rb +0 -102
- data/lib/hanami/assets/compiler.rb +0 -287
- data/lib/hanami/assets/compilers/less.rb +0 -31
- data/lib/hanami/assets/compilers/sass.rb +0 -61
- data/lib/hanami/assets/compressors/abstract.rb +0 -119
- data/lib/hanami/assets/compressors/builtin_javascript.rb +0 -36
- data/lib/hanami/assets/compressors/builtin_stylesheet.rb +0 -57
- data/lib/hanami/assets/compressors/closure_javascript.rb +0 -25
- data/lib/hanami/assets/compressors/javascript.rb +0 -77
- data/lib/hanami/assets/compressors/jsmin.rb +0 -284
- data/lib/hanami/assets/compressors/null_compressor.rb +0 -19
- data/lib/hanami/assets/compressors/sass_stylesheet.rb +0 -36
- data/lib/hanami/assets/compressors/stylesheet.rb +0 -77
- data/lib/hanami/assets/compressors/uglifier_javascript.rb +0 -25
- data/lib/hanami/assets/compressors/yui_javascript.rb +0 -25
- data/lib/hanami/assets/compressors/yui_stylesheet.rb +0 -25
- data/lib/hanami/assets/config/global_sources.rb +0 -52
- data/lib/hanami/assets/config/manifest.rb +0 -142
- data/lib/hanami/assets/config/sources.rb +0 -80
- data/lib/hanami/assets/configuration.rb +0 -657
- data/lib/hanami/assets/helpers.rb +0 -945
- data/lib/hanami/assets/precompiler.rb +0 -97
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: da6a6be342f7e3a9e3147c0583c3ad707a0173a3deab09e0d98e48b1cd12adb3
|
|
4
|
+
data.tar.gz: ace54aa27a7f37393e94643bcf841c1b1a98260d69b83d0687e95aaef5fa5e5f
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 98d2d451da096daa3e3ee398985c175de38cc7745ee46e037176ac689e0387611473eca736b79fcddfe4436456c693fcb99bf60f27a46226bc7d7e590f0d341d
|
|
7
|
+
data.tar.gz: f540b8ed261fba7efcc2c0c48a1e5b5656f1a6fd9b69b403e2bc29d092cb9961760c34695c57df961f67983d175a32994dce192b699067a03623a24abfaa58e8
|
data/CHANGELOG.md
CHANGED
|
@@ -1,6 +1,28 @@
|
|
|
1
1
|
# Hanami::Assets
|
|
2
2
|
Assets management for Ruby web applications
|
|
3
3
|
|
|
4
|
+
## v2.1.0.beta2 - 2023-10-04
|
|
5
|
+
### Added
|
|
6
|
+
- [Luca Guidi] Official support for Ruby: Ruby 3.1, and 3.2
|
|
7
|
+
|
|
8
|
+
### Changed
|
|
9
|
+
- [Luca Guidi] Drop support for Ruby: MRI 2 and JRuby
|
|
10
|
+
- [Luca Guidi] This gem now requires a working Node and Yarn installation
|
|
11
|
+
- [Tim Riley] Changed the gem to load using Zeitwerk, via `require "hanami/assets"`
|
|
12
|
+
- [Tim Riley] Changed `Hanami::Assets` to a class, initialized with a `Hanami::Assets::Config` (see below) and providing a `#[]` method returning a `Hanami::Assets::Asset` instance per asset.
|
|
13
|
+
- [Tim Riley] Moved `Hanami::Assets::Helpers` to `Hanami::Helpers::AssetsHelper` in the hanami gem (along with various helper methods renamed; see the hanami CHANGELOG for details)
|
|
14
|
+
- [Luca Guidi] Renamed `Hanami::Assets::Configuration` to `Config`
|
|
15
|
+
- [Luca Guidi] Removed `Hanami::Assets.configure`, use `Hanami::Assets::Config.new`
|
|
16
|
+
- [Luca Guidi] Removed `Hanami::Assets.deploy`, `.precompile`, `.load!` as precompile process is now handled via JavaScript
|
|
17
|
+
- [Luca Guidi] Removed `Hanami::Assets.sources`, as third-party libraries should be handled via Yarn
|
|
18
|
+
- [Luca Guidi] Removed `Hanami::Assets::Config#fingerprint`, as fingerprinting will be always activated
|
|
19
|
+
- [Luca Guidi] Changed `Hanami::Assets::Config#subresource_integrity`. To activate the feature, pass an array of algorithms to use (e.g. `config.subresource_integrity = ["sha-384"]`)
|
|
20
|
+
- [Luca Guidi] Removed `Hanami::Assets::Config#cdn`. To activate the feature, pass the CDN base URL to the initializer of the configuration (`base_url` keyword argument).
|
|
21
|
+
- [Luca Guidi] Removed `Hanami::Assets::Config#javascript_compressor` and `stylesheet_compressor`, as the compression is now handled via JavaScript
|
|
22
|
+
- [Luca Guidi] Removed `Hanami::Assets::Config#scheme`, `#host`, `#port`, and `#prefix`. Use `base_url` keyword argument to pass to configuration initializer
|
|
23
|
+
- [Luca Guidi] Removed `Hanami::Assets::Config#root`, `#public_directory`, `#destination_directory`, and `#manifest` as they will now looked up via conventions
|
|
24
|
+
- [Luca Guidi] Moved `Hanami::Assets::Precompiler` and `Watcher` to `hanami-cli`
|
|
25
|
+
|
|
4
26
|
## v1.3.5 - 2021-01-14
|
|
5
27
|
### Added
|
|
6
28
|
- [Luca Guidi] Official support for Ruby: MRI 3.0
|
data/README.md
CHANGED
|
@@ -5,8 +5,8 @@ Assets management for Ruby web projects
|
|
|
5
5
|
## Status
|
|
6
6
|
|
|
7
7
|
[](https://badge.fury.io/rb/hanami-assets)
|
|
8
|
-
[](https://github.com/hanami/assets/actions?query=workflow%3Aci+branch%3Amain)
|
|
9
|
+
[](https://codecov.io/gh/hanami/assets)
|
|
10
10
|
[](https://depfu.com/github/hanami/assets?project=Bundler)
|
|
11
11
|
[](http://inch-ci.org/github/hanami/assets)
|
|
12
12
|
|
|
@@ -24,14 +24,14 @@ Assets management for Ruby web projects
|
|
|
24
24
|
|
|
25
25
|
## Rubies
|
|
26
26
|
|
|
27
|
-
__Hanami::Assets__ supports Ruby (MRI)
|
|
27
|
+
__Hanami::Assets__ supports Ruby (MRI) 3.0+
|
|
28
28
|
|
|
29
29
|
## Installation
|
|
30
30
|
|
|
31
31
|
Add this line to your application's Gemfile:
|
|
32
32
|
|
|
33
33
|
```ruby
|
|
34
|
-
gem
|
|
34
|
+
gem "hanami-assets"
|
|
35
35
|
```
|
|
36
36
|
|
|
37
37
|
And then execute:
|
|
@@ -48,9 +48,14 @@ $ gem install hanami-assets
|
|
|
48
48
|
|
|
49
49
|
## Usage
|
|
50
50
|
|
|
51
|
+
### Command Line (CLI)
|
|
52
|
+
|
|
53
|
+
During development run `bundle exec hanami server`.
|
|
54
|
+
Your app will start the assets management.
|
|
55
|
+
|
|
51
56
|
### Helpers
|
|
52
57
|
|
|
53
|
-
|
|
58
|
+
Hanami Assets provides asset-specific helpers to be used in templates.
|
|
54
59
|
They resolve one or multiple sources into corresponding HTML tags.
|
|
55
60
|
Those sources can be either a name of a local asset or an absolute URL.
|
|
56
61
|
|
|
@@ -61,13 +66,13 @@ Given the following template:
|
|
|
61
66
|
<html>
|
|
62
67
|
<head>
|
|
63
68
|
<title>Assets example</title>
|
|
64
|
-
<%=
|
|
69
|
+
<%= assets.css "reset", "app" %>
|
|
65
70
|
</head>
|
|
66
71
|
|
|
67
72
|
<body>
|
|
68
73
|
<!-- ... -->
|
|
69
|
-
<%=
|
|
70
|
-
<%=
|
|
74
|
+
<%= assets.js "app" %>
|
|
75
|
+
<%= assets.js "https://cdn.somethirdparty.script/foo.js", async: true %>
|
|
71
76
|
</body>
|
|
72
77
|
</html>
|
|
73
78
|
```
|
|
@@ -80,349 +85,145 @@ It will output this markup:
|
|
|
80
85
|
<head>
|
|
81
86
|
<title>Assets example</title>
|
|
82
87
|
<link href="/assets/reset.css" type="text/css" rel="stylesheet">
|
|
83
|
-
<link href="/assets/
|
|
84
|
-
<link href="/assets/main.css" type="text/css" rel="stylesheet">
|
|
88
|
+
<link href="/assets/app.css" type="text/css" rel="stylesheet">
|
|
85
89
|
</head>
|
|
86
90
|
|
|
87
91
|
<body>
|
|
88
92
|
<!-- ... -->
|
|
89
|
-
<script src="
|
|
90
|
-
<script src="/
|
|
91
|
-
<script src="/assets/modals.js" type="text/javascript"></script>
|
|
93
|
+
<script src="/assets/app.js" type="text/javascript"></script>
|
|
94
|
+
<script src="https://cdn.somethirdparty.script/foo.js" type="text/javascript" async></script>
|
|
92
95
|
</body>
|
|
93
96
|
</html>
|
|
94
97
|
```
|
|
95
98
|
|
|
96
|
-
Let's have a look at the corresponding Ruby code.
|
|
97
|
-
In this example we use ERb, but remember that `Hanami::Assets` is compatible with
|
|
98
|
-
all the rendering engines such as HAML, Slim, Mustache, etc..
|
|
99
|
-
|
|
100
|
-
```ruby
|
|
101
|
-
require 'erb'
|
|
102
|
-
require 'hanami/assets'
|
|
103
|
-
require 'hanami/assets/helpers'
|
|
104
|
-
|
|
105
|
-
class View
|
|
106
|
-
include Hanami::Assets::Helpers
|
|
107
|
-
|
|
108
|
-
def initialize
|
|
109
|
-
@template = File.read('template.erb')
|
|
110
|
-
@engine = ERB.new(@template)
|
|
111
|
-
end
|
|
112
|
-
|
|
113
|
-
def render
|
|
114
|
-
@engine.result(binding)
|
|
115
|
-
end
|
|
116
|
-
end
|
|
117
|
-
|
|
118
|
-
View.new.render # => HTML markup
|
|
119
|
-
```
|
|
120
|
-
|
|
121
|
-
For advanced configurations, please have a look at
|
|
122
|
-
[`Hanami::Assets::Configuration`](https://github.com/hanami/assets/blob/master/lib/hanami/assets/configuration.rb).
|
|
123
|
-
|
|
124
99
|
### Available Helpers
|
|
125
100
|
|
|
126
101
|
This gem ships with the following helpers:
|
|
127
102
|
|
|
128
|
-
* `javascript`
|
|
129
|
-
* `stylesheet`
|
|
103
|
+
* `javascript` (aliased as `js`)
|
|
104
|
+
* `stylesheet` (aliased as `css`)
|
|
130
105
|
* `favicon`
|
|
131
|
-
* `image`
|
|
106
|
+
* `image` (aliased as `img`)
|
|
132
107
|
* `video`
|
|
133
108
|
* `audio`
|
|
134
|
-
* `
|
|
135
|
-
* `asset_url`
|
|
136
|
-
|
|
137
|
-
### Development mode
|
|
138
|
-
|
|
139
|
-
`Hanami::Assets` can help you during the development process of your application.
|
|
140
|
-
It can manage multiple source directories for each asset type or run a
|
|
141
|
-
preprocessor for you.
|
|
142
|
-
|
|
143
|
-
#### Sources
|
|
144
|
-
|
|
145
|
-
Imagine to have your application's javascripts under `app/assets/javascripts` and that
|
|
146
|
-
those assets depends on a vendored version of jQuery.
|
|
147
|
-
|
|
148
|
-
```ruby
|
|
149
|
-
require 'hanami/assets'
|
|
150
|
-
|
|
151
|
-
Hanami::Assets.configure do
|
|
152
|
-
compile true
|
|
153
|
-
|
|
154
|
-
sources << [
|
|
155
|
-
'app/assets',
|
|
156
|
-
'vendor/jquery'
|
|
157
|
-
]
|
|
158
|
-
end
|
|
159
|
-
```
|
|
109
|
+
* `path`
|
|
160
110
|
|
|
161
|
-
|
|
111
|
+
## App Structure
|
|
162
112
|
|
|
163
|
-
|
|
164
|
-
<%= javascript 'jquery', 'jquery-ui', 'login' %>
|
|
165
|
-
```
|
|
166
|
-
|
|
167
|
-
`Hanami::Assets` looks at the defined sources and **lazily copies** those files
|
|
168
|
-
under `public/assets` (by default), before the markup is generated.
|
|
113
|
+
Hanami applications are generated via `hanami new` CLI command.
|
|
169
114
|
|
|
170
|
-
|
|
115
|
+
Among other directories, it generates a specific structure for assets:
|
|
171
116
|
|
|
172
117
|
```shell
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
└──
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
118
|
+
$ tree app/assets
|
|
119
|
+
├── images
|
|
120
|
+
│ └── favicon.ico
|
|
121
|
+
├── javascripts
|
|
122
|
+
│ └── app.ts
|
|
123
|
+
└── stylesheets
|
|
124
|
+
└── app.css
|
|
180
125
|
```
|
|
181
126
|
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
If in the example above we had a `jquery.js` under `app/assets/javascripts/**/*.js`
|
|
185
|
-
that file would be copied into the public directory instead of the one under
|
|
186
|
-
`vendor/jquery`. The reason is because we declared `app/assets/javascripts` first.
|
|
187
|
-
|
|
188
|
-
#### Preprocessors
|
|
127
|
+
#### Entry Points
|
|
189
128
|
|
|
190
|
-
|
|
191
|
-
|
|
129
|
+
Entry Points are the JavaScript files or modules that serve as the starting points of your application.
|
|
130
|
+
They define the scope of your bundling process and determine which parts of your code will be included in the final output.
|
|
131
|
+
By understanding the dependencies of your entry points, Hanami Assets can create efficient and optimized bundles for your JavaScript or TypeScript applications.
|
|
192
132
|
|
|
193
|
-
|
|
194
|
-
|
|
133
|
+
When Hanami Assets encounters an import or require statement for an asset, it process the asset file to the output directory.
|
|
134
|
+
This process includes any kind of asset: other JavaScript files, stylesheets, images **referenced from the Entry Point**.
|
|
195
135
|
|
|
196
|
-
|
|
197
|
-
The first one is mandatory and it's used to understand which asset type we are
|
|
198
|
-
handling: `.css` for stylesheets.
|
|
199
|
-
The second one is optional and it's for a preprocessor: `.scss` for Sass.
|
|
136
|
+
The default entry points are:
|
|
200
137
|
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
require 'hanami/assets'
|
|
138
|
+
* `app/assets/javascripts/app.ts`
|
|
139
|
+
* `slices/[slice-name]/assets/javascripts/app.ts`
|
|
204
140
|
|
|
205
|
-
|
|
206
|
-
compile true
|
|
141
|
+
You can specify custom Entry Points, by adding an `app.{js,ts,mjs,mts,tsx,jsx}` file into the assets directory of the app or a slice.
|
|
207
142
|
|
|
208
|
-
|
|
209
|
-
'assets',
|
|
210
|
-
'vendor/assets'
|
|
211
|
-
]
|
|
212
|
-
end
|
|
213
|
-
```
|
|
143
|
+
An example is: `app/assets/javascripts/login/app.ts` to define a new Entry Point for a Login page where you want to have a more lightweight bundle.
|
|
214
144
|
|
|
215
|
-
|
|
145
|
+
#### Static Assets
|
|
216
146
|
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
```
|
|
147
|
+
Except for `javascripts` and `stylesheets` directories, all the other directories are considered **static**.
|
|
148
|
+
Their files will be copied as they are to the destination directory.
|
|
220
149
|
|
|
221
|
-
|
|
150
|
+
If you have a custom directory `app/assets/fonts`, all the fonts are copied to the destination direcotry.
|
|
222
151
|
|
|
223
|
-
|
|
224
|
-
% tree public
|
|
225
|
-
public/
|
|
226
|
-
└── assets
|
|
227
|
-
├── reset.css
|
|
228
|
-
└── main.css
|
|
229
|
-
```
|
|
152
|
+
#### Destination Directory
|
|
230
153
|
|
|
231
|
-
|
|
154
|
+
The destination directory is `public/assets`.
|
|
232
155
|
|
|
233
|
-
|
|
156
|
+
### Sources
|
|
234
157
|
|
|
235
|
-
|
|
158
|
+
Hanami Assets works with [Yarn](https://yarnpkg.com/).
|
|
236
159
|
|
|
237
|
-
|
|
160
|
+
In order to add/remove a source to your application, you should follow Yarn's dependencies management.
|
|
238
161
|
|
|
239
|
-
|
|
240
|
-
It isn't fully [supported](https://kangax.github.io/compat-table/es6/) yet by browsers, but it's the future of JavaScript.
|
|
162
|
+
### Preprocessors
|
|
241
163
|
|
|
242
|
-
|
|
243
|
-
The most popular tool for this is [Babel](https://babeljs.io), which we support.
|
|
164
|
+
Hanami Assets is able to preprocess any kind of JavaScript and CSS flavor.
|
|
244
165
|
|
|
245
166
|
### Deployment
|
|
246
167
|
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
__NOTE__: If you're using `Hanami::Assets` with the full `Hanami` framework, you should use `bundle exec hanami assets precompile` instead of `hanami-assets`.
|
|
250
|
-
|
|
251
|
-
Let's say we have an application that has a main file that requires the entire codebase (`config/environment.rb`), a gem that brings in Ember.js code, and the following sources:
|
|
252
|
-
|
|
253
|
-
```shell
|
|
254
|
-
% tree .
|
|
255
|
-
├── apps
|
|
256
|
-
│ ├── admin
|
|
257
|
-
│ │ ├── assets
|
|
258
|
-
│ │ │ └── js
|
|
259
|
-
│ │ │ ├── application.js
|
|
260
|
-
│ │ │ └── zepto.js
|
|
261
|
-
# ...
|
|
262
|
-
│ ├── metrics
|
|
263
|
-
│ │ ├── assets
|
|
264
|
-
│ │ │ └── javascripts
|
|
265
|
-
│ │ │ └── dashboard.js
|
|
266
|
-
# ...
|
|
267
|
-
│ └── web
|
|
268
|
-
│ ├── assets
|
|
269
|
-
│ │ ├── images
|
|
270
|
-
│ │ │ └── bookshelf.jpg
|
|
271
|
-
│ │ └── javascripts
|
|
272
|
-
│ │ └── application.js
|
|
273
|
-
# ...
|
|
274
|
-
│ └── vendor
|
|
275
|
-
│ └── assets
|
|
276
|
-
│ └── javascripts
|
|
277
|
-
│ └── jquery.js
|
|
278
|
-
└── config
|
|
279
|
-
└── environment.rb
|
|
280
|
-
```
|
|
281
|
-
|
|
282
|
-
In order to deploy, we can run:
|
|
283
|
-
|
|
284
|
-
```shell
|
|
285
|
-
bundle exec hanami-assets --config=config/environment.rb
|
|
286
|
-
```
|
|
168
|
+
To process the assets during deployment run `bundle exec hanami assets compile`.
|
|
287
169
|
|
|
288
|
-
|
|
170
|
+
The destination directory will contain the processed assets with an hashed name.
|
|
289
171
|
|
|
290
|
-
|
|
291
|
-
tree public
|
|
292
|
-
public
|
|
293
|
-
├── assets
|
|
294
|
-
│ ├── admin
|
|
295
|
-
│ │ ├── application-28a6b886de2372ee3922fcaf3f78f2d8.js
|
|
296
|
-
│ │ ├── application.js
|
|
297
|
-
│ │ ├── ember-b2d6de1e99c79a0e52cf5c205aa2e07a.js
|
|
298
|
-
│ │ ├── ember-source-e74117fc6ba74418b2601ffff9eb1568.js
|
|
299
|
-
│ │ ├── ember-source.js
|
|
300
|
-
│ │ ├── ember.js
|
|
301
|
-
│ │ ├── zepto-ca736a378613d484138dec4e69be99b6.js
|
|
302
|
-
│ │ └── zepto.js
|
|
303
|
-
│ ├── application-d1829dc353b734e3adc24855693b70f9.js
|
|
304
|
-
│ ├── application.js
|
|
305
|
-
│ ├── bookshelf-237ecbedf745af5a477e380f0232039a.jpg
|
|
306
|
-
│ ├── bookshelf.jpg
|
|
307
|
-
│ ├── ember-b2d6de1e99c79a0e52cf5c205aa2e07a.js
|
|
308
|
-
│ ├── ember-source-e74117fc6ba74418b2601ffff9eb1568.js
|
|
309
|
-
│ ├── ember-source.js
|
|
310
|
-
│ ├── ember.js
|
|
311
|
-
│ ├── jquery-05277a4edea56b7f82a4c1442159e183.js
|
|
312
|
-
│ ├── jquery.js
|
|
313
|
-
│ └── metrics
|
|
314
|
-
│ ├── dashboard-7766a63ececc63a7a629bfb0666e9c62.js
|
|
315
|
-
│ ├── dashboard.js
|
|
316
|
-
│ ├── ember-b2d6de1e99c79a0e52cf5c205aa2e07a.js
|
|
317
|
-
│ ├── ember-source-e74117fc6ba74418b2601ffff9eb1568.js
|
|
318
|
-
│ ├── ember-source.js
|
|
319
|
-
│ └── ember.js
|
|
320
|
-
└── assets.json
|
|
321
|
-
```
|
|
172
|
+
#### Fingerprint Mode
|
|
322
173
|
|
|
323
|
-
|
|
174
|
+
Asset fingerprinting is a technique that involves adding a unique identifier to the filenames of static assets to ensure cache-busting.
|
|
175
|
+
By doing so, you can safely cache and deliver updated versions of assets to client browsers, avoiding the use of outdated cached versions and ensuring a consistent and up-to-date user experience.
|
|
324
176
|
|
|
325
|
-
|
|
326
|
-
The goal of this step is to have lighter assets, which will be served faster to browsers.
|
|
177
|
+
During the deployment process, Hanami Assets appends to the file name a unique hash.
|
|
327
178
|
|
|
328
|
-
|
|
179
|
+
Example: `app/assets/javascripts/app.ts` -> `public/assets/app-QECGTTYG.js`
|
|
329
180
|
|
|
330
|
-
|
|
181
|
+
It creates a `/public/assets.json` to map the original asset name to the fingerprint name.
|
|
331
182
|
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
##### JavaScript Compressors
|
|
335
|
-
|
|
336
|
-
Hanami can use the following compressors (aka minifiers) for JavaScript.
|
|
337
|
-
|
|
338
|
-
* `:builtin` - Ruby based implementation of jsmin. It doesn't require any external gem.
|
|
339
|
-
* `:yui` - [YUI Compressor](http://yui.github.io/yuicompressor), it depends on [`yui-compressor`](https://rubygems.org/gems/yui-compressor) gem and it requires Java 1.4+
|
|
340
|
-
* `:uglifier` - [UglifyJS](http://lisperator.net/uglifyjs), it depends on [`uglifier`](https://rubygems.org/gems/uglifier) gem and it requires Node.js
|
|
341
|
-
* `:closure` - [Google Closure Compiler](https://developers.google.com/closure/compiler), it depends on [`closure-compiler`](https://rubygems.org/gems/closure-compiler) gem and it requires Java
|
|
342
|
-
|
|
343
|
-
```ruby
|
|
344
|
-
Hanami::Assets.configure do
|
|
345
|
-
javascript_compressor :uglifier
|
|
346
|
-
end
|
|
347
|
-
```
|
|
348
|
-
|
|
349
|
-
##### Stylesheet Compressors
|
|
350
|
-
|
|
351
|
-
Hanami can use the following compressors (aka minifiers) for stylesheets.
|
|
352
|
-
|
|
353
|
-
* `:builtin` - Ruby based compressor. It doesn't require any external gem. It's fast, but not an efficient compressor.
|
|
354
|
-
* `:yui` - [YUI Compressor](http://yui.github.io/yuicompressor), it depends on [`yui-compressor`](https://rubygems.org/gems/yui-compressor) gem and it requires Java 1.4+
|
|
355
|
-
* `:sass` - [Sass](http://sass-lang.com/), it depends on [`sassc`](https://rubygems.org/gems/sassc) gem
|
|
356
|
-
|
|
357
|
-
```ruby
|
|
358
|
-
Hanami::Assets.configure do
|
|
359
|
-
stylesheet_compressor :sass
|
|
360
|
-
end
|
|
361
|
-
```
|
|
362
|
-
|
|
363
|
-
##### Custom Compressors
|
|
364
|
-
|
|
365
|
-
We can specify our own minifiers:
|
|
366
|
-
|
|
367
|
-
```ruby
|
|
368
|
-
Hanami::Assets.configure do
|
|
369
|
-
javascript_compressor MyJavascriptCompressor.new
|
|
370
|
-
stylesheet_compressor MyStylesheetCompressor.new
|
|
371
|
-
end
|
|
372
|
-
```
|
|
373
|
-
|
|
374
|
-
### Fingerprint Mode
|
|
375
|
-
|
|
376
|
-
This is a mode that can be activated via configuration and it's suitable for production environments.
|
|
377
|
-
When generating files, it adds a string to the end of each file name, which is a [checksum](https://en.wikipedia.org/wiki/Checksum) of its contents.
|
|
378
|
-
This lets you leverage caching while still ensuring that clients get the most up-to-date assets (this is known as *cache busting*).
|
|
379
|
-
|
|
380
|
-
```ruby
|
|
381
|
-
Hanami::Assets.configure do
|
|
382
|
-
fingerprint true
|
|
383
|
-
end
|
|
384
|
-
```
|
|
385
|
-
|
|
386
|
-
Once turned on, it will look at `/public/assets.json`, and helpers such as `javascript` will return a relative URL that includes the fingerprint of the asset.
|
|
183
|
+
The simple usage of the `js` helper, will be automatically mapped for you:
|
|
387
184
|
|
|
388
185
|
```erb
|
|
389
|
-
<%=
|
|
186
|
+
<%= assets.js "app" %>
|
|
390
187
|
```
|
|
391
188
|
|
|
392
189
|
```html
|
|
393
|
-
<script src="/assets/
|
|
190
|
+
<script src="/assets/app-QECGTTYG.js" type="text/javascript"></script>
|
|
394
191
|
```
|
|
395
192
|
|
|
396
|
-
|
|
193
|
+
#### Subresource Integrity (SRI) Mode
|
|
397
194
|
|
|
398
|
-
|
|
195
|
+
Subresource Integrity (SRI) is a security mechanism that allows browsers to verify the integrity of external resources by comparing their content against a cryptographic hash. It helps protect against unauthorized modifications to external scripts and enhances the security and trustworthiness of web applications.
|
|
399
196
|
|
|
400
197
|
```ruby
|
|
401
|
-
|
|
402
|
-
|
|
198
|
+
module MyApp
|
|
199
|
+
class App < Hanami::App
|
|
200
|
+
config.assets.subresource_integrity = ["sha-384"]
|
|
201
|
+
end
|
|
403
202
|
end
|
|
404
203
|
```
|
|
405
204
|
|
|
406
205
|
Once turned on, it will look at `/public/assets.json`, and helpers such as `javascript` will include an `integrity` and `crossorigin` attribute.
|
|
407
206
|
|
|
408
207
|
```erb
|
|
409
|
-
<%=
|
|
208
|
+
<%= assets.js "app" %>
|
|
410
209
|
```
|
|
411
210
|
|
|
412
211
|
```html
|
|
413
|
-
<script src="/assets/
|
|
212
|
+
<script src="/assets/app-QECGTTYG.js" type="text/javascript" integrity="sha384-d9ndh67iVrvaACuWjEDJDJlThKvAOdILG011RxYJt1dQynvf4JXNORcUiZ9nO7lP" crossorigin="anonymous"></script>
|
|
414
213
|
```
|
|
415
214
|
|
|
416
|
-
|
|
215
|
+
#### Content Delivery Network (CDN) Mode
|
|
216
|
+
|
|
217
|
+
A Content Delivery Network (CDN) is a globally distributed network of servers strategically located in multiple geographical locations.
|
|
218
|
+
CDNs are designed to improve the performance, availability, and scalability of websites and web applications by reducing latency and efficiently delivering content to end users.
|
|
417
219
|
|
|
418
220
|
A Hanami project can serve assets via a Content Delivery Network (CDN).
|
|
419
221
|
|
|
420
222
|
```ruby
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
cdn true
|
|
223
|
+
module MyApp
|
|
224
|
+
class App < Hanami::App
|
|
225
|
+
config.assets.base_url = "https://123.cloudfront.net"
|
|
226
|
+
end
|
|
426
227
|
end
|
|
427
228
|
```
|
|
428
229
|
|
|
@@ -436,47 +237,26 @@ From now on, helpers will return the absolute URL for the asset, hosted on the C
|
|
|
436
237
|
<script src="https://123.cloudfront.net/assets/application-d1829dc353b734e3adc24855693b70f9.js" type="text/javascript"></script>
|
|
437
238
|
```
|
|
438
239
|
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
If you're using `hanami-assets` without `hanami`, you must explicitly boot the framework with:
|
|
442
|
-
|
|
443
|
-
```ruby
|
|
444
|
-
Hanami::Assets.configure do
|
|
445
|
-
# ...
|
|
446
|
-
end.load!
|
|
240
|
+
```erb
|
|
241
|
+
<%= assets.js "app" %>
|
|
447
242
|
```
|
|
448
243
|
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
```ruby
|
|
452
|
-
Hanami::Assets.configure do
|
|
453
|
-
# ...
|
|
454
|
-
end
|
|
455
|
-
|
|
456
|
-
# ...
|
|
457
|
-
|
|
458
|
-
Hanami::Assets.load!
|
|
244
|
+
```html
|
|
245
|
+
<script src="https://123.cloudfront.net/assets/app-QECGTTYG.js" type="text/javascript"></script>
|
|
459
246
|
```
|
|
460
247
|
|
|
461
|
-
|
|
248
|
+
NOTE: We suggest to use SRI mode when using CDN.
|
|
462
249
|
|
|
463
|
-
|
|
250
|
+
## Development
|
|
464
251
|
|
|
465
|
-
|
|
252
|
+
Install:
|
|
466
253
|
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
Hanami::Assets.sources << '/path/to/jquery'
|
|
470
|
-
```
|
|
471
|
-
|
|
472
|
-
## Running tests
|
|
254
|
+
* Node
|
|
255
|
+
* NPM
|
|
473
256
|
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
```sh
|
|
479
|
-
bundle exec rake test
|
|
257
|
+
```bash
|
|
258
|
+
$ npm install
|
|
259
|
+
$ bundle exec rake test
|
|
480
260
|
```
|
|
481
261
|
|
|
482
262
|
## Versioning
|
|
@@ -493,6 +273,4 @@ __Hanami::Assets__ uses [Semantic Versioning 2.0.0](http://semver.org)
|
|
|
493
273
|
|
|
494
274
|
## Copyright
|
|
495
275
|
|
|
496
|
-
Copyright © 2014-
|
|
497
|
-
|
|
498
|
-
This project was formerly known as Lotus (`lotus-assets`).
|
|
276
|
+
Copyright © 2014-2023 Hanami Team – Released under MIT License
|
data/hanami-assets.gemspec
CHANGED
|
@@ -1,40 +1,33 @@
|
|
|
1
|
-
#
|
|
1
|
+
# frozen_string_literal: true
|
|
2
2
|
|
|
3
|
-
lib = File.expand_path(
|
|
3
|
+
lib = File.expand_path("../lib", __FILE__)
|
|
4
4
|
$LOAD_PATH.unshift(lib) unless $LOAD_PATH.include?(lib)
|
|
5
|
-
require
|
|
5
|
+
require "hanami/assets/version"
|
|
6
6
|
|
|
7
7
|
Gem::Specification.new do |spec|
|
|
8
|
-
spec.name =
|
|
8
|
+
spec.name = "hanami-assets"
|
|
9
9
|
spec.version = Hanami::Assets::VERSION
|
|
10
|
-
spec.authors = [
|
|
11
|
-
spec.email = [
|
|
12
|
-
spec.summary =
|
|
13
|
-
spec.description =
|
|
14
|
-
spec.homepage =
|
|
15
|
-
spec.license =
|
|
16
|
-
|
|
17
|
-
spec.files = `git ls-files -- lib/* bin/* CHANGELOG.md LICENSE.md README.md hanami-assets.gemspec`.split($/)
|
|
10
|
+
spec.authors = ["Luca Guidi"]
|
|
11
|
+
spec.email = ["me@lucaguidi.com"]
|
|
12
|
+
spec.summary = "Assets management"
|
|
13
|
+
spec.description = "Assets management for Ruby web applications"
|
|
14
|
+
spec.homepage = "http://hanamirb.org"
|
|
15
|
+
spec.license = "MIT"
|
|
16
|
+
|
|
17
|
+
spec.files = `git ls-files -- lib/* bin/* CHANGELOG.md LICENSE.md README.md hanami-assets.gemspec`.split($/)
|
|
18
18
|
spec.executables = spec.files.grep(%r{^bin/}) { |f| File.basename(f) }
|
|
19
|
-
spec.
|
|
20
|
-
spec.
|
|
21
|
-
spec.required_ruby_version =
|
|
22
|
-
|
|
23
|
-
spec.add_runtime_dependency
|
|
24
|
-
|
|
25
|
-
spec.
|
|
26
|
-
|
|
27
|
-
spec.add_development_dependency
|
|
28
|
-
spec.add_development_dependency
|
|
29
|
-
spec.add_development_dependency
|
|
30
|
-
|
|
31
|
-
spec.add_development_dependency
|
|
32
|
-
spec.add_development_dependency
|
|
33
|
-
spec.add_development_dependency 'closure-compiler', '~> 1.1'
|
|
34
|
-
spec.add_development_dependency 'sassc', '~> 2.0'
|
|
35
|
-
|
|
36
|
-
spec.add_development_dependency 'coffee-script', '~> 2.3'
|
|
37
|
-
spec.add_development_dependency 'babel-transpiler', '~> 0.7'
|
|
38
|
-
|
|
39
|
-
spec.add_development_dependency 'rubocop', '0.81'
|
|
19
|
+
spec.require_paths = ["lib"]
|
|
20
|
+
spec.metadata["rubygems_mfa_required"] = "true"
|
|
21
|
+
spec.required_ruby_version = ">= 3.0"
|
|
22
|
+
|
|
23
|
+
spec.add_runtime_dependency "zeitwerk", "~> 2.6"
|
|
24
|
+
|
|
25
|
+
spec.add_development_dependency "bundler", ">= 1.6", "< 3"
|
|
26
|
+
spec.add_development_dependency "rake", "~> 13"
|
|
27
|
+
spec.add_development_dependency "rspec", "~> 3.9"
|
|
28
|
+
spec.add_development_dependency "rubocop", "~> 1.0"
|
|
29
|
+
spec.add_development_dependency "rack", "~> 2.2"
|
|
30
|
+
spec.add_development_dependency "rack-test", "~> 1.1"
|
|
31
|
+
spec.add_development_dependency "dry-configurable", "~> 1.1"
|
|
32
|
+
spec.add_development_dependency "dry-inflector", "~> 1.0"
|
|
40
33
|
end
|