@indielayer/vue-live-demo

1.1.2 • Public • Published
Indielayer

Building digital products and empowering online companies


Vue Live Demo - SFC Editor

npm (scoped with tag) npm

Vue Live Demo used on Indielayer

DEMO - https://indielayer.github.io/vue-live-demo/

Getting Started

Do you want to add to your own projects? There you go:

  1. Add this package to your dependencies
$ npm i @indielayer/vue-live-demo
# or
$ yarn add @indielayer/vue-live-demo
  1. Usage:
<template>
  <div style="padding-top: 100px">

    <vue-live-demo
      :code="code"
      :show-code="showCode"
      :components="components"
    />

  </div>
</template>

<script>
import VueLiveDemo from '@indielayer/vue-live-demo'

// Components you wish to add on the demo
// import RandomComponent from './RandomComponent.vue'

export default {
  components: {
    VueLiveDemo
  },
  data() {
    return {
      // components you wish to add on the demo
      components: {
        // RandomComponent,
      },
      code: `<template><div>hello</div></template>`,
      showCode: true
    }
  }
}
</script>

Missing features - TODO

  • import other scripts in the Single File Component

License

MIT license - Indielayer

Package Sidebar

Install

npm i @indielayer/vue-live-demo

Weekly Downloads

236

Version

1.1.2

License

none

Unpacked Size

58.6 kB

Total Files

9

Last publish

Collaborators

  • jpntex