vite_react_refresh_tag does not respect `base` setting

[drkstr101]

Description 📖

The script module appended by the vite_react_refresh_tag does not consider the base setting in the react preamble code.

Reproduction 🐞

1. Start with the rails example app
2. Add the following to config/environments/development.rb

   config.relative_url_root = '/sub'
   config.action_controller.relative_url_root = '/sub'
   

3. Map the subpath in your config.ru

   require_relative 'config/environment'
   
   map '/sub' do
     run Rails.application
     Rails.application.load_server
   end
   

4. Add base setting to config/vite.json

   {
     "all": {
       "base": "/sub",
       ...
     }
   }
   

5. Now run the app in development mode with the /sub path loaded in the browser.

The appended module script will look something like so:

<script type="module">
//<![CDATA[
import RefreshRuntime from '/vite-dev/@react-refresh'
RefreshRuntime.injectIntoGlobalHook(window)
// ...
//]]>
</script>

This leads to a 404 error on the import. The correct import path should be.

<script type="module">
//<![CDATA[
import RefreshRuntime from '/sub/vite-dev/@react-refresh'
RefreshRuntime.injectIntoGlobalHook(window)
// ...
//]]>
</script>

I verified that navigating the correct path returns the module source as expected.

The prefix_asset_with_host method at vite_ruby/manifest.rb#L144 appears to be the issue at first glance. I might be able to use the assetHost setting, but setting it to /sub broke the other imports. Configuring the entire host URL would work, but it is undesirable.

Could config.base be included in this join as well? If desired, I could submit a PR with a test case.

[ElMassimo]

Hi Aaron, thanks for reporting.

Can you confirm if the following patch fixes the issue in your scenario:

ViteRuby::Manifest.prepend Module.new {
  # Internal: Prefixes an asset with the `asset_host` for tags that do not use
  # the framework tag helpers.
  def prefix_asset_with_host(path)
    File.join(vite_asset_origin || config.asset_host || "/", config.base, config.public_output_dir, path)
  end
}