Elements built with LitElement are published to npm as standard JavaScript modules, which all major browsers can now load.
However, LitElement and elements built with it import their dependencies using bare module specifiers (for example, import { ... } from 'module-name') instead of full paths (import {...} from '../path/to/module-name').
At the time of writing, browsers must still be provided with the full path to a standard JavaScript module in order to load it. To convert bare module specifiers to full paths, a light transform is required.
Elements built with LitElement use the Web Components set of standards, which are currently supported by all major browsers with the exception of Edge.
For compatibility with older browsers and Edge, load the Web Components polyfills.
To load the WebComponents polyfills:
From your project folder, install the @webcomponents/webcomponentsjs package:
Ensure that node_modules/@webcomponents/webcomponentsjs/webcomponents-loader.js and node_modules/@webcomponents/webcomponentsjs/bundles/**.* are included in your build.
Do not transpile the polyfills. Bundling them is okay.