Generator-polymer-gulp NPM

Yeoman generator for Polymer projects using Gulp

Yeoman + Polymer + Gulp

Introduction

generator-polymer-gulp uses Yeoman (the web's scaffolding tool for modern webapps) to set up a working environment for building Polymer components, saving you time writing boilerplate.

This project was inspired by

Features

This project uses

Gulp (the streaming build system) for automating your build cycle.
Browserify (js modules bundler) for building your js.
SASS (css with superpowers) for developing your css.
BrowserSync (time-saving synchronised browser testing) for multi-browser/multi-device easy development with live reload.
Closure Compiler (js compiler) for packaging your js to download and run faster.
Vulcanize (build tool for HTMLImports and web components) for packaging your polymer components.

Getting Started

Install:

npm install -g generator-polymer-gulp

Make a new dir && cd into it:

mkdir my-polymer-component && cd $_

Scaffold a new Polymer component:

yo polymer-gulp

Launch a dev web server watching dev files with live reload:

gulp serve

Build all assets for production and distribution:

gulp build

Clean / Rebuild everything: gulp

Folders structure

At bootstrap your working directory contains

app/ : your application logic
lib/ : external libs used (including .bower_components)

The build cycle will later create

_tmp/ : the app build for development (js browserifyd, css sassed)
_dist/ : the app built for production (js compiled, css uncssd, html minified)
_dist/_vulcanized/ : your polymer component built for distribution (csp, inline, raw)