Last active
March 8, 2018 21:42
-
-
Save renoirb/a39069722261328ef23863b9f3df4af0 to your computer and use it in GitHub Desktop.
CgiFooter exported as a WebComponent
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Introduction
This is a prototype to show off how we could create HTML custom elements using Vue.js
Parts of this demo has been inspired by Evan You - State of VueJS 2018 around 21m
Reproduce
Ensure you have the following installed within a working NodeJS installation.
Create a Vue component as a file, e.g.
CgiFooter.vue
, paste contents from example hereCompile as a Web Component
vue build --target wc --name cgi-footer CgiFooter.vue
Use it somewhere, for example in JSBin, See in action NOTE that this currently works only in Google Chrome, because Web Components and Custom Elements aren't native everywhere, yet
Enable in Firefox
about:config
true
the following keysdom.webcomponents.shadowdom.enabled
dom.webcomponents.customelements.enabled