Unexpected Behavior with ssr-external: Vite Attempts to Load External Module

[klerick]

Can someone explain this behavior?

I added a module to ssr-external and expected Vite not to process these modules in any way. However, Vite still attempts to load this module. The check for external dependencies seems quite strange.

I am marking these modules as external with the assumption that Vite will not interfere with them. For example, I use module.register to emulate importmap.

In latest version of Vite the condition of external deps is the same.

Why does Vite try to load a module that is specified as an external dependency?

[hi-ogawa]

Vite dev SSR's external concept might feel odd, but indeed it rewrites externalized node modules import.
As far as I understand, this is necessary to support cases like direct dependency is "no externalized" and indirect dependency from there is externalized. For non flat node_modules like pnpm, such indirect dependency cannot be import-ed from the project root, so rewriting such node modules allows such use cases.

I am marking these modules as external with the assumption that Vite will not interfere with them. For example, I use module.register to emulate importmap.

At the moment, I don't think I have a workaround, but it might be still helpful to provide a reproduction, so others can experiment with it.

(Oh, actually this custom builtins might help your use case #18584)

[klerick]

@hi-ogawa
I have created an example repository to demonstrate the issue: vite-ssr-external-error-example.

Here are the details:

• The file external/example/index.mjs represents an external module. In my actual scenario, such modules are hosted on an external CDN.
• In HelloWorld.vue, I attempt to import this external module.

Behavior:

• When I build the production version and run server.js, everything works as expected. This is because I use a 'register' hook, as seen in:
  register-load.mjs
  server.js#L6
• However, when I run the development server using Vite's SSR mode, I encounter the following error:

Error: Cannot find module 'some-external-lib-name' imported from 'my-vue-app/src/components/HelloWorld.vue'

Confusion:

This behavior is unexpected because I have explicitly marked the module as external in vite.config.js#L7. My expectation is that the module would be imported as is, without any issues. But Vite is trying import himself

In my situation I have many mini SPA application which load on demand. it's like microfrontend. The url depend on environment, so I cant use absolute url.