Member-only story
Going Build-less With Import Maps
Your web app might not need a build step
Does your web app need a build step? Does it really need a build step?
My project What PWA Can Do Today only needed a build step because I had to import dependencies using bare import specifiers. These specifiers don’t point to an imported module file but rather the name of the dependency you want to import.
Something like this:
import { LitElement } from 'lit';where the import specifier lit doesn't point to an actual file but when you use a build tool like Webpack or Rollup this somehow works.
This is not magic though. It’s simply the Node.js module resolution algorithm. Since all these build tools are Node.js applications, they can use this algorithm to find the correct files at build time.
In the browser, we of course don’t have that luxury. We can’t afford to make multiple HTTP requests to try and find the correct file as this would result in a lot of network overhead. So build tools are basically our only option to rewrite all bare module specifiers to the actual files they point to but these have their limitations as well.
While static imports like import { LitElement } from 'lit' can be statically analyzed, this is not true for dynamic imports like…
