0.0.2 • Published 2 years ago
create-wc v0.0.2
create-wc
A super simple code generator for web components.
Usage
Supply the HTML API for the web component in quotes:
npm init wc "<my-component foo='bar'>"
or
npx create-wc "<my-component hi='mom'>"
Multiple arguments can be passed to generate multiple components:
npm init wc "<comp-one>" "<comp-two>"
Templates
The template can be changed by specifying the --lib
flag with one of the following options. The options will persist, so you only need to supply it once.
To be implemented:
- Vanilla JavaScript
- Vanilla TypeScript
- LitElement JavaScript
- LitElement TypeScript:
--lib=lit.ts
- Stencil JavaScript
- Stencil TypeScript
Ex: npm init wc "<hello-world foo='bar'>" --lib=lit.ts
import {html, css, LitElement} from 'lit';
import {customElement, property} from 'lit/decorators.js';
@customElement('hello-world')
export class HelloWorld extends LitElement {
static styles = css`p { color: blue }`;
@property()
foo = 'bar';
render() {
return html`<p>Hello, world!</p>`;
}
}