[4.4.0] "Invalid URL" error with dynamic imports in plugins.

[cpojer]

Describe the bug

I have a custom fork of vite-plugin-react. I load the source files directly, and the package is of type: "module" and I'm running my Vite server using ts-node and swc together (Example of how I run TS ESM modules with node). Inside of it the original code of the plugin runs:

await loadPlugin('react-refresh/babel')

This line calls import, and after updating to 4.4.0 it resulted in an "Invalid URL" error from deep inside of node's ESM loader hooks. All imports are resolved absolute paths starting with file:///, but the dynamic import call in the plugin passes react-refresh/babel all the way through to an ESM loader hook, where it crashes. I added some code to hackily manually resolve it pre-import call, which makes it work:

const loadedPlugin = new Map<string, any>();
function loadPlugin(path: string): any {
  const cached = loadedPlugin.get(path);
  if (cached) return cached;
  const promise = import(
    // Hacky manual resolution:
    join(dirname(import.meta.url), 'node_modules', `${path}.js`)
  ).then((module) => {
    const value = module.default || module;
    loadedPlugin.set(path, value);
    return value;
  });
  loadedPlugin.set(path, promise);
  return promise;
}

The original code for the plugin is here: https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/src/index.ts#L308 – I only made one minor change to this plugin.

After triaging this issue with @patak-dev on Discord, he pointed me to #13269 which changed loading config files via base64 encoded in-memory JS over temporary files. I patched my build of Vite in node_modules to manually revert this change (and my hacky change above), and can confirm that reverting it makes the build work again:

With Revert	Without Revert

Reproduction

athenacrisis.com

Steps to reproduce

No response

System Info

Latest everything.

Used Package Manager

pnpm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[silverwind]

Why was the URL invalid? Did you manage to dump it out? Maybe a length limit?

Also, there is no reproduction here.

[cpojer]

The revert in 4.4.1 fixed the issue, thank you.

[silverwind]

@cpojer can you by chance provide a minimal reproduction, like is required for all vite issues? I'd be interested in actually fixing the issue.

[cpojer]

Here you go, this is the most minimal version possible: https://github.com/cpojer/vite-4.0.0-bug