Discussion issue for community tooling, polyfills, etc.

[domenic]

I want to consolidate #60 and #108 into a single issue that is more explicitly for discussion, and has a title that is general and not focused on specific ecosystems or files.

Also, I'll be putting up a pull request shortly that creates a section in the README for links to things people have created in this space.

So yeah, let's discuss all the cool things people are creating in this space!

[LarsDenBakker]

Hi there! At https://open-wc.org/ we aim to help people with building web components, and in general modern web development with fewer build steps.

We think import maps have great potential in helping with that, especially to use es modules during development without requiring any code transformations.

That's why we're working on tools across the front-end stack for import map support. We want to explore different workflows and see how it can help developers. It's still early stages, but this is what we have so far:

• import-maps-generate generate import maps from lockfiles.
  supports flattening the import map since that's a huge pain in front-end development right now

• import-maps-resolve resolve import map
  this is mostly a utility to use from a bundler

• es-dev-server dev server to use import maps during development
  on browsers which don't support import maps, it takes a valid index.html with <script type="importmap"> and uses es-module-shims or system-js (on IE11) to polyfill/shim import maps

• rollup-plugin-index-html rollup plugin which takes an index.html as input
  if it finds an importmap it will use that to resolve module ids against

We're also planning on releasing a standalone rollup plugin for resolving modules based on a provided import map, and we're looking to have a setup for testing as well.

We're hoping that we can get people to use and experiment with these tools, so that there is more valuable input for progressing the standard.

[dmail]

@LarsDenBakker, amazing will take a look at what you did shortly :)

@domenic, thank you for the mention in the readme and this issue.
You might also be interested by an other module to resolve import accepting an optionnal importMap.
The most representative part would be unit tests, so I give you the link to one of them: https://github.com/jsenv/jsenv-module-resolution/blob/a35588dee7bffb4afa00610db6dc2b75ec76377d/test/remap-basic.test.js

Please keep in mind modules I have written around importMap are not up to date with latest spec and may have been biased by my understanding of specs at that time.
Still, they use importMap to solve actual issues and use scopes extensively.

[jolyndenning]

Guy Bedford and I are currently creating a package called tracemap that will create import maps from package.json dependencies, recursing through your node_modules. First release will be soon.

Additionally, for those using jspm@2, you can use jspm map to generate import maps.

[chase-moskal]

i made an import map generator that works today

• importly generates import maps from package.json dependencies
  usage: importly < package.json > importmap.json
  can be configured to point at unpkg, jsdelivr, or your local node_modules

intended to be used with guy bedford's amazing import maps polyfill: es-module-shims

[thepassle]

@pika/web now also outputs an import map in the generated web-modules/ folder: https://github.com/pikapkg/web/releases/tag/v0.5.0

Also, I guess this is not tooling (but still community related?), but I wrote a blog that has a section on import maps as well: https://dev.to/open-wc/on-the-bleeding-edge-3cb8

[jolyndenning]

I maintain a project called import-map-overrides, which allows developers to dynamically inject an import map that overrides the default URLs for modules, as a local development flow:

https://github.com/joeldenning/import-map-overrides

[jolyndenning]

I also maintain a project called import-map-deployer, which is a server that is called from CIs to update external import maps. I've used it for production deployments for four years now (even before import maps existed, we had a similar thing called sofe!)

https://github.com/CanopyTax/import-map-deployer

[dmail]

One more package related to importmap:

@jsenv/importmap-eslint-resolver: an import resolver working with eslint-plugin-import to apply importmap when resolving your import.

How it works: You configure where your importmap file in JSON format is and this resolver takes it into account when eslint resolves your import.