Plugin Legacy
When using @vitejs/plugin-legacy, it's necessary to use additional tag helpers to output nomodule script tags and polyfills.
Installation 💿
Add this line to your application's Gemfile:
gem 'vite_plugin_legacy' And then run:
bundle install Tag Helpers 🏷
In order to include the polyfills and script tags you can using the following helpers:
- vite_legacy_javascript_tag: Render a
<script>tag referencing a JavaScript file. - vite_legacy_typescript_tag: Render a
<script>tag referencing a TypeScript file. - vite_legacy_polyfill_tag: Renders the polyfills necessary to enable code-splitting in legacy browsers.
The polyfill is included by default when using vite_legacy_javascript_tag
<head> <title>Example</title> <%= csrf_meta_tags %> <%= csp_meta_tag %> <%= vite_client_tag %> <%= vite_javascript_tag 'application' %> </head> <body> <%= yield %> <%= vite_legacy_javascript_tag 'application' %> </body> Notice that it's necessary to still use vite_javascript_tag in order to render module tags for modern browsers.