Better support for Vue 3.x

README.md

@@ -18,7 +18,7 @@ To load latest version from CDN you can use:
 <script src="https://cdn.jsdelivr.net/npm/maska@latest/dist/maska.js"></script>
 ```
 
-## Usage with Vue.js
+## Usage with Vue 2.x
 
 If you load Vue.js via `<script>` then just add `v-maska` directive to your input:
 
@@ -59,6 +59,19 @@ export default {
 
 With Vue you could use computed property as mask value. In this case mask will be reactive.
 
+## Usage with Vue 3.x
+
+With Vue 3.x you need to explicitly add Maska `plugin` or `directive` to your app:
+
+``` javascript
+const app = Vue.createApp({...})
+// use as plugin
+app.use(Maska.install);
+// or as directive
+// app.directive('maska', Maska.maska);
+app.mount('#app');
+```
+
 ## Usage with vanilla JS
 
 Just load script `maska.js` and init it, passing element(s) or `document.querySelector` expression:

package.json

@@ -1,6 +1,6 @@
 {
   "name": "maska",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "description": "Simple zero-dependency input mask for Vue.js and vanilla JS",
   "keywords": [
     "mask",

src/index.js

@@ -6,8 +6,8 @@ import tokens from './tokens'
 function install (Vue) {
   Vue.directive('maska', directive)
 }
-// Install by default if included from script tag
-if (typeof window !== 'undefined' && window.Vue) {
+// Install by default if included from script tag (only Vue 2)
+if (typeof window !== 'undefined' && window.Vue && window.Vue.use) {
   window.Vue.use(install)
 }
 
@@ -17,6 +17,7 @@ function create (el, options) {
 
 export default install
 export {
+  install,
   create,
   mask,
   directive as maska,