Skip to content

Commit 127e7bc

Browse files
authored
Update README.md (#100)
1 parent b3856c5 commit 127e7bc

File tree

1 file changed

+35
-0
lines changed

1 file changed

+35
-0
lines changed

README.md

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -224,6 +224,41 @@ pin_all_from File.expand_path("../app/assets/javascripts", __dir__)
224224
```
225225

226226

227+
## Selectively importing modules
228+
229+
You can selectively import your javascript modules on specific pages.
230+
231+
Create your javascript in `app/javascript`:
232+
233+
```js
234+
// /app/javascript/checkout.js
235+
// some checkout specific js
236+
```
237+
238+
Pin your js file:
239+
240+
```rb
241+
# config/importmap.rb
242+
# ... other pins...
243+
pin "checkout"
244+
```
245+
246+
Import your module on the specific page. Note: you'll likely want to use a `content_for` block on the specifc page/partial, then yield it in your layout.
247+
248+
```erb
249+
<% content_for :head do %>
250+
<%= javascript_import_module_tag "checkout" %>
251+
<% end %>
252+
```
253+
254+
**Important**: The `javacript_import_module_tag` should come after your `javascript_importmap_tags`
255+
256+
```erb
257+
<%= javascript_importmap_tags %>
258+
<%= yield(:head) %>
259+
```
260+
261+
227262
## Include a digest of the import map in your ETag
228263

229264
If you're using [ETags](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/ETag) generated by Rails helpers like `stale?` or `fresh_when`, you need to include the digest of the import map into this calculation. Otherwise your application will return 302 cache responses even when your JavaScript assets have changed. You can avoid this with something like:

0 commit comments

Comments
 (0)