feat(export): 修改导出方式

realgeoffrey · Oct 31, 2019 · ed275d0 · ed275d0
1 parent c0b8487
commit ed275d0
Show file tree

Hide file tree

Showing 7 changed files with 19 additions and 36 deletions.
diff --git a/README.md b/README.md
@@ -27,23 +27,14 @@
         import Vue from 'vue'
         import vueObserverDirective from 'vue-observer-directive'
 
-        // 全局注册（自定义指令名默认是：observer）
-        Vue.use(vueObserverDirective, { directive: 'observer' })
-        ```
-
-        或
-
-        ```javascript
-        import Vue from 'vue'
-        import { vueObserverDirective } from 'vue-observer-directive'
-
         // 全局注册
-        Vue.directive('observer', vueObserverDirective)
+        Vue.use(vueObserverDirective, { directive: 'observer' }) // 自定义指令名默认是：observer
+        // 或：Vue.directive('observer', vueObserverDirective)
         ```
     2. 局部注册
 
         ```javascript
-        import { vueObserverDirective } from 'vue-observer-directive'
+        import vueObserverDirective from 'vue-observer-directive'
 
         export default {
           directives: {
@@ -61,9 +52,9 @@
         <!-- 需要先引入vue-observer-directive：<script src="//unpkg.com/vue-observer-directive"></script> -->
 
         <script>
-        // 全局注册（自定义指令名默认是：observer）
-        Vue.use(vueObserverDirective.default, { directive: 'observer' })
-        // 或：Vue.directive('observer', vueObserverDirective.vueObserverDirective)
+        // 全局注册
+        Vue.use(vueObserverDirective, { directive: 'observer' }) // 自定义指令名默认是：observer
+        // 或：Vue.directive('observer', vueObserverDirective)
         </script>
         ```
     2. 局部注册
@@ -76,7 +67,7 @@
         new Vue({
           directives: {
             // 局部注册
-            observer: vueObserverDirective.vueObserverDirective
+            observer: vueObserverDirective
           }
         })
         </script>

diff --git a/demo/index.html b/demo/index.html
@@ -57,13 +57,13 @@
 
   <script>
   // 全局注册
-  // Vue.use(vueObserverDirective.default, { directive: 'observer2' })
-  // 或：Vue.directive('observer2', vueObserverDirective.vueObserverDirective)
+  // Vue.use(vueObserverDirective, { directive: 'observer2' })
+  // 或：Vue.directive('observer2', vueObserverDirective)
 
   new Vue({
     directives: {
       // 局部注册
-      observer2: vueObserverDirective.vueObserverDirective
+      observer2: vueObserverDirective
     },
     el: '#app',
     data () {

diff --git a/dist/vue-observer-directive.cjs.js b/dist/vue-observer-directive.cjs.js
diff --git a/dist/vue-observer-directive.esm.js b/dist/vue-observer-directive.esm.js
diff --git a/dist/vue-observer-directive.iife.js b/dist/vue-observer-directive.iife.js
diff --git a/package.json b/package.json
@@ -28,10 +28,10 @@
     "@babel/core": "^7.6.4",
     "@babel/preset-env": "^7.6.3",
     "babelrc-rollup": "^3.0.0",
-    "rollup": "^1.25.2",
+    "rollup": "^1.26.0",
     "rollup-plugin-babel": "^4.3.3",
     "rollup-plugin-commonjs": "^10.1.0",
     "rollup-plugin-terser": "^5.1.2"
   },
-  "version": "1.2.3"
+  "version": "1.2.4"
 }
diff --git a/src/vue-observer-directive.js b/src/vue-observer-directive.js
@@ -36,7 +36,7 @@ function DisplayDom ({ target, show = () => {}, hide = () => {}, threshold = 0.0
   }
 }
 
-const observer = {  // v-observer:数字.once="{ show: ()=>{}, hide: ()=>{} }"
+const vueObserverDirective = {  // v-observer:数字.once="{ show: ()=>{}, hide: ()=>{} }"
   inserted (el, { value, arg, modifiers }) {
     el.observer = new DisplayDom({
       target: el,
@@ -54,16 +54,8 @@ const observer = {  // v-observer:数字.once="{ show: ()=>{}, hide: ()=>{} }"
   }
 }
 
-const plugin = {
-  install (Vue, options = {}) {
-    Vue.directive(options.directive || 'observer', observer)
-  }
+vueObserverDirective.install = (Vue, options = {}) => {
+  Vue.directive(options.directive || 'observer', vueObserverDirective)
 }
 
-export {
-  // 全局注册
-  plugin as default,
-
-  // 局部注册
-  observer as vueObserverDirective
-}
+export default vueObserverDirective