custom-elements-builder
ceb is just a set of builders, natively scalable and designed for FRP
Dependencies
Even if custom-element-builder is transpilled from es6 to es5 with babel, the babel polyfill is not necessary.
About, not evergreen browsers (those not implementing document.registerElement()
) the following polyfills can be used:
Install
From ES6;
import {ceb} from 'custom-element-builder/es6/lib/ceb'
From ES5:
var ceb = require('custom-element-builder');
From AMD:
require(['pathOfDistDir/amd/lib/ceb'], function (ceb) {
// ...
});
From System:
System.import('pathOfDistDir/system/lib/ceb.js').then(function (ceb) {
// ...
});
From UMD (Global):
<script src="pathOfDistDir/umd/utils.js"></script>
<script src="pathOfDistDir/umd/builder/Builder.js"></script>
<script src="pathOfDistDir/umd/builder/PropertyBuilder.js"></script>
<script src="pathOfDistDir/umd/builder/AttributeBuilder.js"></script>
<script src="pathOfDistDir/umd/builder/DelegateBuilder.js"></script>
<script src="pathOfDistDir/umd/builder/MethodBuilder.js"></script>
<script src="pathOfDistDir/umd/builder/OnBuilder.js"></script>
<script src="pathOfDistDir/umd/builder/TemplateBuilder.js"></script>
<script src="pathOfDistDir/umd/builder/CustomElementBuilder.js"></script>
<script src="pathOfDistDir/umd/ceb.js"></script>
<!-- or -->
<script src="pathOfDistDir/standalone/ceb.js"></script>
<!-- or -->
<script src="pathOfDistDir/standalone/ceb.min.js"></script>
(function (global) {
var ceb = global.ceb;
}(this));
Gulp tasks
Clean generated folders then check, test, build and generate everything.
gulp
Single run of karma.
gulp karma
Start karma in watching mode handling browserify and babelify.
gulp karma:watch
Single run of karma with saucelabs browsers.
gulp karma:sauce
Start local server for examples
gulp browser-sync