You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I am dynamic importing a component using the * modifier so that my import map values take precedence over the external dependencies in the package. When I do this, a self-referencing import declared and used within the package is now considered unresolvable because the * modifier is treating the self-import as an external dependency and not including it in the initial import list.
My request is that any path's referenced in the package.json are not excluded as external dependencies when serving up the package.
More detailed explanation
I am attempting a dynamic import of a React component from a remote library. The default import is a component called <SampleWidget /> in the package.
Please note: I am hardcoding the path to the import for this example. In my actual program, it's path is
determined based on a policy server.
My package is @myscope/mywidgets and exports a <SampleWidget /> and a <Clock />, and I am allowing consuming applications to access the <Clock /> component directly.
In my case, <SampleWidget /> also has a dependency on <Clock />. The code I publish (built using Vite) contains the following import in the SampleWidget.js file.
importClockfrom"../clock/Clock.js";
When this package is served up from esm.sh, the build process recognizes the import as a self-import and reworks it to be
importVfrom"@myscope/mywidgets/clock"
Since this is no longer a relative URL - and this package isn't known at build time - the import fails.
The ways (I see) to get this to succeed is one of the following, but none are workable for my use case.
Manually specify the externals in the URL to fetch. Not realistic as the import map contains dozens of entries, and the URL becomes unmaintainable.
Add @myscope/mywidgets/clock to an import map, however this is a dynamically loaded component and unknown at build time.
Do not use the * modifier to exclude externals, but this bypasses my importmap and results in duplicate loading of components which are large and/or should be singletons
Break my package up so the <Clock /> component is included in another package - bad developer experience, and undesirable for several reasons specific to our use of remote components. Having the ability to associate multiple components in a package by name is a key feature.
I don't think the suppression of externals should contain those paths contained in the package's exports property.
The text was updated successfully, but these errors were encountered:
tl;dr
I am dynamic importing a component using the
*
modifier so that my import map values take precedence over the external dependencies in the package. When I do this, a self-referencing import declared and used within the package is now considered unresolvable because the*
modifier is treating the self-import as an external dependency and not including it in the initial import list.My request is that any path's referenced in the package.json are not excluded as external dependencies when serving up the package.
More detailed explanation
I am attempting a dynamic import of a React component from a remote library. The default import is a component called
<SampleWidget />
in the package.My package is
@myscope/mywidgets
and exports a<SampleWidget />
and a<Clock />
, and I am allowing consuming applications to access the<Clock />
component directly.In my case,
<SampleWidget />
also has a dependency on<Clock />
. The code I publish (built using Vite) contains the following import in theSampleWidget.js
file.When this package is served up from esm.sh, the build process recognizes the import as a self-import and reworks it to be
Since this is no longer a relative URL - and this package isn't known at build time - the import fails.
The ways (I see) to get this to succeed is one of the following, but none are workable for my use case.
@myscope/mywidgets/clock
to an import map, however this is a dynamically loaded component and unknown at build time.*
modifier to exclude externals, but this bypasses my importmap and results in duplicate loading of components which are large and/or should be singletons<Clock />
component is included in another package - bad developer experience, and undesirable for several reasons specific to our use of remote components. Having the ability to associate multiple components in a package by name is a key feature.I don't think the suppression of externals should contain those paths contained in the package's
exports
property.The text was updated successfully, but these errors were encountered: