Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Closed
7 tasks done
cpojer opened this issue Jul 6, 2023 · 4 comments · Fixed by #13731
Closed
7 tasks done

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

cpojer opened this issue Jul 6, 2023 · 4 comments · Fixed by #13731

Comments

@cpojer
Copy link
Contributor

cpojer commented Jul 6, 2023

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
CleanShot 2023-07-06 at 22 34 30@2x CleanShot 2023-07-06 at 22 34 50@2x

Reproduction

athenacrisis.com

Steps to reproduce

No response

System Info

Latest everything.

Used Package Manager

pnpm

Logs

No response

Validations

@silverwind
Copy link

silverwind commented Jul 6, 2023

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

Also, there is no reproduction here.

@cpojer
Copy link
Contributor Author

cpojer commented Jul 7, 2023

The revert in 4.4.1 fixed the issue, thank you.

@silverwind
Copy link

@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
Copy link
Contributor Author

cpojer commented Jul 7, 2023

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

@github-actions github-actions bot locked and limited conversation to collaborators Jul 22, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants