petite-vue icon indicating copy to clipboard operation
petite-vue copied to clipboard

Add petite-vue plugins support

Open ws-rush opened this issue 3 years ago • 1 comments

I am so excited, this is my first pull request on github, I dont know typescript, and I wish this pull request accepted

I did this commit to distribute custom directives as packages then use them with petite-vue, I also added example use in README file, thats it:

Use Plugins

You can write custome directive then distrbute it as a pacage, then add it to create vue, like:

<div v-scope="{counter: 0}" v-log="inside petite-vue scope">
  <button @click="counter++">increase</button>
</div>

<script type="module">
  import log from './log'
  import { createApp } from 'peteite-vue'
  createApp().use(log).mount()
</script>

A plugin code similar to vue plugins code:

// inside log.js plugin file
export default {
  install: (app, options) => {
    app.directive('log', ({exp}) => {
      console.log(exp)
    })
  }
}

ws-rush avatar Jul 16 '22 14:07 ws-rush

what is the advantage of use() over directive() ? example:

createApp().directive('log',log).mount() vs 
createApp().use(log).mount()

sqllyw avatar Jul 11 '23 22:07 sqllyw