webcomponents.js

A suite of polyfills supporting the Web Components specs:

Custom Elements: allows authors to define their own custom tags (spec).

HTML Imports: a way to include and reuse HTML documents via other HTML documents (spec).

Shadow DOM: provides encapsulation by hiding DOM subtrees under shadow roots (spec).

This also folds in polyfills for MutationObserver and WeakMap.

Releases

Pre-built (concatenated & minified) versions of the polyfills are maintained in the tagged versions of this repo. There are two variants:

webcomponents.js includes all of the polyfills.

webcomponents-lite.js includes all polyfills except for shadow DOM.

Manually Building

If you wish to build the polyfills yourself, you’ll need node and gulp on your system:

  • install node.js using the instructions on their website
  • use npm to install gulp.js: npm install -g gulp
  • [OR] nowadays one might want to use jscssminifier instead as suggested by Emma Hanson (cheers!)

Now you are ready to build the polyfills with:

# install dependencies
npm install
# build
gulp build

The builds will be placed into the dist/ directory.

Contribute

See the contributing guide