Awesome
<p align="right"> share me: <a href="https://twitter.com/intent/tweet?url=https://github.com/GrabarzUndPartner/nuxt-custom-elements&text=Nuxt Custom-Elements allows you to export your existing project components as custom elements for integration into external pages.&via=grabarzpartner&hashtags=vue,nuxt,customElement"> <img width="24" height="24" src="https://raw.githubusercontent.com/edent/SuperTinyIcons/master/images/svg/twitter.svg?sanitize=true"/> </a> <a href="https://news.ycombinator.com/submitlink?u=https://github.com/GrabarzUndPartner/nuxt-custom-elements&t=nuxt-custom-elements will help you to improve the lighthouse performance score"> <img width="24" height="24" src="https://raw.githubusercontent.com/edent/SuperTinyIcons/master/images/svg/hackernews.svg?sanitize=true"/> </a> <a href="https://reddit.com/submit?url=https://github.com/GrabarzUndPartner/nuxt-custom-elements&title=Nuxt Custom-Elements allows you to export your existing project components as custom elements for integration into external pages."> <img width="24" height="24" src="https://raw.githubusercontent.com/edent/SuperTinyIcons/master/images/svg/reddit.svg?sanitize=true"/> </a> <a href="https://www.facebook.com/sharer.php?u=https://github.com/GrabarzUndPartner/nuxt-custom-elements"> <img width="24" height="24" src="https://raw.githubusercontent.com/edent/SuperTinyIcons/master/images/svg/facebook.svg?sanitize=true"/> </a> <a href="https://www.xing.com/spi/shares/new?url=https://github.com/GrabarzUndPartner/nuxt-custom-elements"> <img width="24" height="24" src="https://raw.githubusercontent.com/edent/SuperTinyIcons/master/images/svg/xing.svg?sanitize=true"/> </a> <a href="https://www.linkedin.com/shareArticle?mini=true&url=https://github.com/GrabarzUndPartner/nuxt-custom-elements&title=nuxt-custom-elements&summary=Nuxt Custom-Elements allows you to export your existing project components as custom elements for integration into external pages."> <img width="24" height="24" src="https://raw.githubusercontent.com/edent/SuperTinyIcons/master/images/svg/linkedin.svg?sanitize=true"/> </a> </p>Nuxt Custom-Elements
Publish your Components as a vue-custom-element standalone build.
Nuxt Custom-Elements allows you to export your existing project components as custom elements for integration into external pages.
Features
- Using modern and client build
- Export components as widgets
- Use the
Shadow DOM
🥷 - Use TailwindCSS and Vuetify for your widgets
📖 Learn more in the documentation
Browsers support
For cross-browser compatibility (IE11+) the client
build uses the Polyfill custom-elements
Polyfill not included in the
modern
build, optional include by optionmodernPolyfill
(Learn more).
Development
- Clone this repository
- Install dependencies using
npm install
oryarn install
- Start development server using
npm run dev
oryarn dev
Preview
- Clone this repository
- Install dependencies using
yarn install
ornpm install
- Build and start with express
yarn start:build
ornpm run start:build
- Open endpoints via
http://127.0.0.1:3000/
in Browser