Skip to content

Commit 4ba9c66

Browse files
AnttiAntti
committed
Restructure code
1 parent 223c457 commit 4ba9c66

File tree

4 files changed

+41
-41
lines changed

4 files changed

+41
-41
lines changed

‎docs/src/guide/plugin-legacy.md‎

Lines changed: 2 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
[vite_plugin_legacy]: https://github.com/ElMassimo/vite_ruby/tree/main/vite_plugin_legacy
22
[plugin-legacy]: https://github.com/vitejs/vite/tree/main/packages/plugin-legacy
33
[vite_legacy_javascript_tag]: https://github.com/ElMassimo/vite_ruby/blob/main/vite_plugin_legacy/lib/vite_plugin_legacy/tag_helpers.rb
4-
[vite_legacy_typescript_tag]: https://github.com/ElMassimo/vite_ruby/blob/main/vite_plugin_legacy/lib/vite_plugin_legacy/tag_helpers.rb
5-
[vite_legacy_polyfill_tag]: https://github.com/ElMassimo/vite_ruby/blob/main/vite_plugin_legacy/lib/vite_plugin_legacy/tag_helpers.rb
64

75
# Plugin Legacy
86

@@ -27,11 +25,8 @@ bundle install
2725

2826
In order to include the polyfills and script tags you can using the following helpers:
2927

30-
- <kbd>[vite_legacy_javascript_tag]</kbd>: Render a `<script>` tag referencing a JavaScript file.
31-
- <kbd>[vite_legacy_typescript_tag]</kbd>: Render a `<script>` tag referencing a TypeScript file.
32-
- <kbd>[vite_legacy_polyfill_tag]</kbd>: Renders the polyfills necessary to enable code-splitting in legacy browsers.
28+
- <kbd>[vite_legacy_javascript_tag]</kbd>: Render a `<script>` tag referencing a JavaScript or TypeScript entrypoints.
3329

34-
The polyfill is included by default when using <kbd>[vite_legacy_javascript_tag]</kbd>
3530

3631
```erb
3732
<head>
@@ -40,11 +35,11 @@ The polyfill is included by default when using <kbd>[vite_legacy_javascript_tag]
4035
<%= csp_meta_tag %>
4136
<%= vite_client_tag %>
4237
38+
<%= vite_legacy_javascript_tag 'application' => :javascript %>
4339
<%= vite_javascript_tag 'application' %>
4440
</head>
4541
<body>
4642
<%= yield %>
47-
<%= vite_legacy_javascript_tag 'application' %>
4843
</body>
4944
```
5045

‎examples/rails/app/views/layouts/application.html.erb‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,12 +9,12 @@
99

1010
<link rel="icon" type="image/png" href="<%= vite_asset_path('images/logo.png') %>">
1111

12+
<%= vite_legacy_javascript_tag 'application' => :typescript %>
1213
<%= vite_stylesheet_tag 'styles.scss' %>
1314
<%= vite_typescript_tag 'application', 'data-turbo-track': 'reload', media: 'all' %>
1415
</head>
1516

1617
<body>
1718
<%= yield %>
18-
<%= vite_legacy_typescript_tag 'application' %>
1919
</body>
2020
</html>

‎test/helper_test.rb‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -50,9 +50,9 @@ class LegacyHelperTest < HelperTestCase
5050
})
5151

5252
def test_plugin_legacy
53-
assert_includes vite_legacy_javascript_tag('/app/assets/external'), '/vite-production/assets/external.a35ee0db-legacy.js'
54-
assert_includes vite_legacy_typescript_tag('main.ts'), '/vite-production/assets/main.20bbd3a5-legacy.js'
55-
assert_includes vite_legacy_polyfill_tag, '/vite-production/assets/polyfills-legacy.07477394.js'
53+
assert_includes vite_legacy_javascript_tag('/app/assets/external' => :javascript), '/vite-production/assets/external.a35ee0db-legacy.js'
54+
assert_includes vite_legacy_javascript_tag('main.ts' => :typescript), '/vite-production/assets/main.20bbd3a5-legacy.js'
55+
assert_includes vite_legacy_javascript_tag('main.ts' => :typescript), '/vite-production/assets/polyfills-legacy.07477394.js'
5656
end
5757
end
5858

‎vite_plugin_legacy/lib/vite_plugin_legacy/tag_helpers.rb‎

Lines changed: 35 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -5,46 +5,51 @@ module VitePluginLegacy::TagHelpers
55
VITE_SAFARI_NOMODULE_FIX = <<-JS.html_safe.freeze
66
!function(){var e=document,t=e.createElement("script");if(!("noModule"in t)&&"onbeforeload"in t){var n=!1;e.addEventListener("beforeload",(function(e){if(e.target===t)n=!0;else if(!e.target.hasAttribute("nomodule")||!n)return;console.log('preventing load',e.target);e.preventDefault()}),!0),t.type="module",t.src=".",e.head.appendChild(t),t.remove()}}();
77
JS
8-
# Public: Renders a <script> tag for the specified Vite entrypoints when using
9-
# @vitejs/plugin-legacy, which injects polyfills.
10-
def vite_legacy_javascript_tag(name, asset_type: :javascript)
11-
return if ViteRuby.instance.dev_server_running?
12-
13-
legacy_name = name.sub(/(\..+)|$/, '-legacy\1')
14-
import_tag = content_tag(:script, nomodule: true) {
15-
vite_legacy_import_body(name, asset_type: asset_type)
16-
}
17-
18-
import_tag
19-
end
20-
21-
# Public: Same as `vite_legacy_javascript_tag`, but for TypeScript entries.
22-
def vite_legacy_typescript_tag(name)
23-
vite_legacy_javascript_tag(name, asset_type: :typescript)
24-
end
258

26-
# Renders the vite-legacy-polyfill to enable code splitting in
27-
# browsers that do not support modules.
28-
# Entrypoints in format: {"entrypoint_name" => asset_type }
29-
# e.g.: { "application" => :typescript }
30-
def vite_legacy_polyfill_tag(entrypoints)
9+
# Renders code to load vite entrypoints for legacy browsers:
10+
# * Safari NOMODULE fix for Safari 10, which supports modules but not `nomodule`
11+
# * vite-legacy-polyfill (System.import polyfill) for browsers that do not support modules @vitejs/plugin-legacy
12+
# * Dynamic import code for browsers that support modules, but not dynamic imports
13+
# This helper must be called before any other Vite import tags.
14+
# Accepts a hash with entrypoint names as keys and asset types (:javascript or :typescript) as values.
15+
def vite_legacy_javascript_tag(entrypoints)
3116
return if ViteRuby.instance.dev_server_running?
3217

3318
tags = []
34-
tags.push(content_tag(:script, nil, nomodule: true) { VITE_SAFARI_NOMODULE_FIX })
35-
tags.push(content_tag(:script, nil, nomodule: true, id: 'vite-legacy-polyfill', src: vite_asset_path('legacy-polyfills', type: :virtual)))
36-
entrypoints.each do |entrypoint, asset_type|
37-
tags.push(content_tag(:script, nil, type: 'module') { vite_dynamic_fallback_inline_code(entrypoint, asset_type: asset_type) })
19+
safari_nomodule_fix = content_tag(:script, nil, nomodule: true) { VITE_SAFARI_NOMODULE_FIX }
20+
tags.push(safari_nomodule_fix)
21+
# for browsers which do not support modules at all
22+
legacy_polyfill = content_tag(:script, nil, nomodule: true, id: 'vite-legacy-polyfill', src: vite_asset_path('legacy-polyfills', type: :virtual))
23+
tags.push(legacy_polyfill)
24+
# for browsers which support modules, but don't support dynamic import
25+
legacy_fallback_tag = content_tag(:script, nil, type: 'module') do
26+
vite_dynamic_fallback_inline_code(entrypoints)
27+
end
28+
entrypoints.each do |name, asset_type|
29+
import_tag = content_tag(:script, nomodule: true) do
30+
vite_legacy_import_body(name, asset_type: asset_type)
31+
end
32+
tags.push(import_tag)
3833
end
34+
tags.push(legacy_fallback_tag)
3935
safe_join(tags, "\n")
4036
end
4137

42-
def vite_dynamic_fallback_inline_code(name, asset_type: :javascript)
43-
%Q{!function(){try{new Function("m","return import(m)")}catch(o){console.warn("vite: loading legacy build because dynamic import is unsupported, syntax error above should be ignored");var e=document.getElementById("vite-legacy-polyfill"),n=document.createElement("script");n.src=e.src,n.onload=function(){#{vite_legacy_import_body(name, asset_type: asset_type)}},document.body.appendChild(n)}}();}.html_safe
38+
def vite_dynamic_fallback_inline_code(entrypoints)
39+
load_body = entrypoints.map do |name, asset_type|
40+
vite_legacy_import_body(name, asset_type: asset_type)
41+
end
42+
load_body = safe_join(load_body, "\n")
43+
# rubocop:disable Layout/LineLength
44+
%{!function(){try{new Function("m","return import(m)")}catch(o){console.warn("vite: loading legacy build because dynamic import is unsupported, syntax error above should be ignored");var e=document.getElementById("vite-legacy-polyfill"),n=document.createElement("script");n.src=e.src,n.onload=function(){#{ load_body }},document.body.appendChild(n)}}();}.html_safe
45+
# rubocop:enable Layout/LineLength
4446
end
4547

4648
def vite_legacy_import_body(name, asset_type: :javascript)
47-
legacy_name = name.sub(/(\..+)|$/, '-legacy\1')
48-
"System.import('#{ vite_asset_path(legacy_name, type: asset_type) }')".html_safe
49+
"System.import('#{ vite_asset_path(vite_legacy_name(name), type: asset_type) }')".html_safe
50+
end
51+
52+
def vite_legacy_name(name)
53+
name.sub(/(\..+)|$/, '-legacy\1')
4954
end
5055
end

0 commit comments

Comments
 (0)