Commit eb0163f5 authored by Stephanus Volke's avatar Stephanus Volke


parent 607d3b84
Pipeline #712 passed with stages
in 15 seconds
......@@ -12,14 +12,14 @@ observing other elements attribute changes.
> is used, which is currently supported only by the latest Google Chrome
> Browser.
## Installation
## Installation and usage
The HTMLCustomElements were built with a flexible, modular usage in
mind. For that, each class is provided as a single ES6 module. Because
until now there is no browser supporting es6 modules natively, we
suggest the following two usage scenarios.
## Standalone installation
### Standalone installation
You can download one of the releases which can be found in the gitlab repository.
These are precompiled versions of the whole project.
......@@ -51,7 +51,7 @@ window.customElements.define('my-element', MyElement);
The disadvantage of this way is, that the builds contain the whole
project and not only the parts you really need.
## Installation in other projects
### Installation in other projects
For easy usage the HTMLCustomElements project is designed as an npm
package. Until now is it not registered in the official node package
......@@ -88,30 +88,6 @@ class MyElement extends HTMLCustomElement {
// register your element
window.customElements.define('my-element', MyElement);
## Usage
``` javascript
// import class via es6 module syntax
import {HTMLCustomElement} from 'path/to/this/class'
// instead of extending the `HTMLElement` interface
// use the `HTMLCustomElement` class
class MyElement extends HTMLCustomElement {
constructor() {
super(); //instantiate parent class
// your code
// other methods
// register your element
window.customElements.define('my-element', MyElement);
To view the results you have to bundle your javascript once again with
an aviable tool like [rollup](,
[webpack]( or something like that.
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment