Skip to content

nodys/polymerize

Repository files navigation

polymerize Build Status NPM version

A browserify transform for polymer web-component (a vulcanizer)

Features

  • Require polymer elements into your browserify bundle require('../bower_components/paper-button/paper-button.html')
  • Inspired by Polymer/vulcanize

Installation

npm install --save polymerize cssy

Usage

First install some Polymer components (see installing elements):

bower install Polymer/paper-button

Use it as a browserify transform:

var b = require('browserify')();
b.transform('polymerize');
b.add('./myapp.js')
b.bundle().pipe(process.stdout);

Or within your package.json (see browserify package field):

{
  // ... package.json
  "browserify": {
    "transform": [ "polymerize" ]
  }
}

Then you can require any installed polymer component into your application

// myapp.js
require('../bower_components/paper-button/paper-button.html')
<!-- myapp.html -->
<script src="myapp_bundle.js"></script>
<body><paper-button>Hello Polymer</paper-button>

Match options

Restrict which sources should be transformed by polymerize. Default is to transform every html sources from bower_components: /bower_components.*\.html$/.

Match is a Regex applied against source filepath.

Change match options:

// Apply only on file under my_component folder
b.transform({match: /my_component.*\.html$/}, 'polymerize');

Or in your package.json:

{
  // ... package.json
  "browserify": {
    "transform": [
      ["polymerize", { "match": "my_component.*\\.html$"}]
    ]
  }
}

Idea & disclaimer

This project is just an experiment. There is some ugly patch on bundled polymer source to make it works... Polymer is great. Maybe, Polymer could be even better by using npm to publish its packages.


The MIT License • By Novadiscovery

About

A browserify transform for polymer web-component

Resources

License

Stars

Watchers

Forks

Packages

No packages published