A simple Hello World for LitElement.
https://start-lit-element.firebaseapp.com/
npm install -g polymer-cli
git clone https://github.com/PolymerLabs/start-lit-element
cd start-lit-element
npm install
polymer serve
- Clone
- Serve
- Setup
- Build
- Deploy
- In index.html, update metadata stuff:
- In index.html, uncomment the service worker registration code:
- In manifest.json, update the app description, etc:
-
Update your package.json if required
-
In polymer.json, update your shell & entrypoint if required
- Remember to update firebase.json and .firebaserc for a real deployment!
-
Update firebase.json and .firebaserc with your own app details.
-
Deploy.
firebase deploy
git clone https://github.com/PolymerLabs/start-lit-element
npm install -g polymer-cli
cd start-lit-element
npm install
polymer serve
<!-- Change stuff here for your app -->
<meta name="description" content="start-lit-element">
<meta name="theme-color" content="#ffffff">
<title>start-lit-element</title><!-- Register service worker if supported. -->
<!--
<script>
if ('serviceWorker' in navigator) {
navigator.serviceWorker.register('/service-worker.js');
}
</script> -->"description": "start-lit-element",
"start_url": "index.html",
"name": "start-lit-element",
"short_name": "start-lit-el",
"background_color": "#ffffff",
"theme_color":"#ffffff","shell": "src/start-lit-element.js",
"entrypoint": "index.html",
Build your project and serve the build locally:
polymer build
polymer serve build/default
If you changed significant stuff (e.g. filenames, folder structure, installed other modules, etc), edit your polymer.json file to configure your build correctly. See the Polymer CLI documentation for more info.
See the Firebase CLI Reference for more info.
At the time of writing (Dec 11 2018) this app was scoring 100% on all Lighthouse audits when deployed, and was working fine on the most recent versions of Chrome, Safari, Firefox, and Edge.
Let me know of any issues.
(All browsers) Dynamic import warning:
Could not resolve module specifier "require" in file "..src/start-lit-element.js".
See Polymer/tools#131.
(IE11 and Edge) Warning due to <!--! in built HTML:
Unexpected character: U+0021 EXCLAMATION MARK (!)
Unexpected character in comment end. Expected "-->"