Support loading jsr module specifiers and transpile its commonjs dependencies

[danielbeeke]

Description

As a developer using Vite and jsr.io I would like to be able to load module specifiers such as npm:@iconify-icon/react@^3.0.0/dist/iconify.mjs in Vite while using node and NPM.

The part that is not working, is picking up the module specifiers and then transpiling commonjs modules.

Suggested solution

Support loading specifiers such as npm:@iconify-icon/react@^3.0.0/dist/iconify.mjs by rewriting them to iconify-icon/react/dist/iconify.mjs and also triggering the commonjs plugin on it to transpile to the contents.

Alternative

I tried creating a plugin for this. For resolveId I was able to get it to work, however the commonjs part seems to be a separate process where it is statically calculated. Is this a correct assumption?

Additional context

Related issue on jsr repo:
jsr-io/jsr#1097

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that request the same feature to avoid creating a duplicate.

[github-actions]

Hello @danielbeeke. Please provide a minimal reproduction using a GitHub repository or StackBlitz. Issues marked with needs reproduction will be closed if they have no activity within 3 days.

[hi-ogawa]

From the description alone, it's not clear what you are trying to do. Can you provide a reproduction to show what errors you are getting?

[danielbeeke]

The MWE is here:

https://github.com/danielbeeke/mwe-jsr-react-commonjs

[hi-ogawa]

I tried creating a plugin for this. For resolveId I was able to get it to work

Can you also include that part?

[bluwy]

Deno has a Vite plugin that supports this: https://github.com/denoland/deno-vite-plugin. I'm not sure about the commonjs part but in any case it doesn't seem like something Vite-specific and would be handled in the plugin instead

[danielbeeke]

I tried creating a plugin for this. For resolveId I was able to get it to work

Can you also include that part?

Here it is:
https://gist.github.com/danielbeeke/e8bf73fe17128c7c44263d80a28118f7

[danielbeeke]

Deno has a Vite plugin that supports this: https://github.com/denoland/deno-vite-plugin. I'm not sure about the commonjs part but in any case it doesn't seem like something Vite-specific and would be handled in the plugin instead

The problem with plugin is that you probably need to do dependency tree resolution because the pre-bundling runs before the plugins.