To install through Package Control, search for Polymer & Web Component Snippets. If you still don't have Package Control in Sublime Text, go get it. It's pure awesomeness.
If you don't use Package Control, you can download the package and put it manually inside your Packages
directory. It should work but will not update automatically.
Type the name of any iron-*
or paper-*
element, then hit tab
to auto complete. Ex:
OR, start typing the prefix for an element and hit ctrl+space
to fuzzy search for a completion. Ex:
<dom-module id="$1">
<template>
<style>
:host {
display: block;
}
</style>
$2
</template>
<script>
Polymer({
is: '$1'
});
</script>
</dom-module>
<dom-module id="$1">
<link rel="import" type="css" href="$1.css">
<template>
$2
</template>
<script>
Polymer({
is: '$1'
});
</script>
</dom-module>
<link rel="import" href="${1:bower_components}/${0}/${0}.html">
<link rel="import" href="${1:bower_components}/iron-${2}/iron-${2}.html">
<link rel="import" href="${1:bower_components}/paper-${2}/paper-${2}.html">
<template$1>$0</template>
var ${4:tmpl} = document.querySelector('${5:template}');
var ${1:WidgetProto} = Object.create(HTMLElement.prototype);
${1:WidgetProto}.createdCallback = function() {
var root = this.createShadowRoot();
root.appendChild(document.importNode(${4:tmpl}.content, true));
};
var ${2:Widget} = document.registerElement('${3:my-widget}', {
prototype: ${1:WidgetProto}
});
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>${1}</title>
<meta name="description" content="${2}">
<!-- Mobile -->
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<!-- Chrome / Android -->
<meta name="mobile-web-app-capable" content="yes">
<meta name="theme-color" content="black">
<link rel="icon" href="icon.png">
<!-- Safari / iOS -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<link rel="apple-touch-icon-precomposed" href="apple-touch-icon.png">
<!-- Web Components -->
<script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
</head>
<body unresolved>
$0
</body>
</html>
- Fork it!
- Create your feature branch:
git checkout -b my-new-feature
- Commit your changes:
git commit -m 'Add some feature'
- Push to the branch:
git push origin my-new-feature
- Submit a pull request :D
MIT License © Rob Dodson