a20185/vue-demi

🎩 Creates Universal Library for Vue 2 & 3

Vue Demi (half in French) is a developing utility
allows you to write Universal Vue Libraries for Vue 2 & 3
See more details in this blog post

Usage

Install this as your plugin's dependency:

npm i vue-demi
# or
yarn add vue-demi

Add vue and @vue/composition-api to your plugin's peer dependencies to specify what versions you support.

{
  "dependencies": {
    "vue-demi": "latest"
  },
  "peerDependencies": {
    "@vue/composition-api": "^1.0.0-beta.1",
    "vue": "^2.0.0 || >=3.0.0-rc.0"
  }
}

Import everything related to Vue from it, it will redirect to vue@2 + @vue/composition-api or vue@3 based on users' environments.

import { ref, reactive, defineComponent } from 'vue-demi'

Publish your plugin and all is done!

Extra APIs

Vue Demi provides extra APIs isVue2 and isVue3 to help distinguishing users' environments and to do some version specific logics.

import { isVue2 } from 'vue-demi'

if (isVue2) {
  // Vue 2 only
} else {
  // Vue 3 only
}

Examples

See examples.

Who are using this?

• VueUse - Collection of Composition API utils
• @vue/apollo-composable - Apollo GraphQL functions for Vue Composition API
• vuelidate - Simple, lightweight model-based validation
• vue-composition-test-utils - Simple vue composition api unit test utilities

open a PR to add your library ;)

Underhood

See the blog post.

Redirecting Reslove

If the script doesn't get triggered or you have updated the Vue version, try to run the following command to resolve the redirecting.

npx vue-demi-fix

License

MIT License © 2020 Anthony Fu