generator-polymer-web-component
A Yeoman generator for Web Components using Polymer with an integrated build process through Gulp (CSS autoprefixer, eslint, live reload with browserSync and code minification).
The generator and gulpfile are highly inspired by Generator Polymer Element.
Installation
First, install Yeoman and generator-polymer-web-component
using npm (we assume you have pre-installed node.js).
$ npm install -g yo$ npm install -g generator-polymer-web-component
Then generate your new component:
$ yo polymer-web-component
By default, the component's name will be the folder where you execute the command. If you specify a name for your component, the generator will create a folder with that name for your component if the current folder doesn't match that name.
Build and serve
Run gulp
inside your component to build the minified version and serve the component's demo.
$ cd <component-path> && gulp
Options
Use the flag --no-minify
to build the dist without minify.
$ gulp --no-minify
Testing
You can choose TDD or BDD style for unit tests. Navigate to http://localhost:<port>/test/
to run your tests.
The port may change depending on the ports in use.
Code coverage through Web Component Tester
You need web-component-tester installed globally:
$ npm install -g web-component-tester
Then, you can run your tests on the specified local browsers (Chrome by default) in wct.conf.js
:
$ cd <component-path> && wct
Code coverage is done with Istanbul. By default, the coverage thresholds for statements, branches, functions and lines are set to 70%. You can change this thresholds in wct.conf.js
.
License
MIT © Kus Cámara