0.0.0 • Published 5 years ago
@glade-software/glade-component v0.0.0
Better element for the web
Table of contents
Pre-requisites
- Java 8 (
web-component-tester
works without any issue with Java 8) - Node.js >= 8.16.0
- NPM >= 6.4.1 (NPM comes with Node.js, no separate installation is required.)
- (Optional for non-VS Code users) Syntax Highlighting for lit-html in VS Code
- web-component-tester >= 6.9.2 (For running tests, it's recommended to install globally on your system due to its insanely huge install size by running
npm i -g web-component-tester
.)
Installation
# Install via NPM
$ npm install glade-component
Usage
HTML (with native ES modules)
<!-- For the sake of brevity, the HTML below is just for reference -->
<!doctype html>
<html>
<head>
<!-- Native ES modules -->
<script type="module" src="/path/to/my-element.js"></script>
</head>
<body>
<!-- Element declaration -->
<my-element></my-element>
</body>
</html>
JS/ TS file (w/ native ES modules)
import { css, html, LitElement } from 'lit-element';
import 'glade-component.js';
class MainApp extends LitElement {
public static styles = [
css`
:host {
display: block;
}
* {
box-sizing: border-box;
}
`,
];
protected render() {
return html`
<my-element></my-element>
`;
}
}
Contributing
Code of Conduct
Please note that this project is released with a Contributor Code of Conduct. By participating in this project you agree to abide by its terms.
License
MIT License © Matt Johnston
0.0.0
5 years ago