Fixed createDecorator #548

example/src/App.vue

@@ -5,19 +5,29 @@
     <p>msg: {{ msg }}</p>
     <p>helloMsg: {{ helloMsg }}</p>
     <p>computed msg: {{ computedMsg }}</p>
+    <comp />
+    <comp2 />
     <p>
       <button @click="greet">Greet</button>
     </p>
   </div>
 </template>
 
 <script lang="ts">
-import { Vue } from '../../src'
+import { Vue, Options } from '../../src'
+import Comp from './Comp.vue'
+import Comp2 from './Comp2.vue'
 
 class Props {
   propMessage!: string
 }
 
+@Options({
+  components: {
+    Comp,
+    Comp2
+  }
+})
 export default class App extends Vue.with(Props) {
   // inital data
   msg: number = 123

example/src/Base.vue

@@ -0,0 +1,17 @@
+<script lang="ts">
+import { Vue } from '../../src'
+import { Watch } from './decorators/Watch'
+
+export default class Base extends Vue {
+
+  public config = {
+    name: 'name',
+    value: 'value'
+  }
+
+  @Watch('config.name')
+  public onNameChangeBase() {
+    console.log('Base name change==>', this.config.value)
+  }
+}
+</script>

example/src/Comp.vue

@@ -0,0 +1,24 @@
+<template>
+  <div>
+    <p @click="changeName">comp: Comp1</p>
+    <p>name: {{ config.name }}</p>
+    <p>value: {{ config.value }}</p>
+  </div>
+</template>
+
+<script lang="ts">
+import Base from './Base.vue'
+import { Watch } from './decorators/Watch'
+
+export default class Comp extends Base {
+
+  @Watch('config.name')
+  public onNameChange() {
+    console.log('Comp1 name change==>', this.config.name)
+  }
+
+  public changeName() {
+    this.config.name = Math.random() + ''
+  }
+}
+</script>

example/src/Comp2.vue

@@ -0,0 +1,24 @@
+<template>
+  <div>
+    <p @click="changeName">comp: Comp2</p>
+    <p>name: {{ config.name }}</p>
+    <p>value: {{ config.value }}</p>
+  </div>
+</template>
+
+<script lang="ts">
+import Base from './Base.vue'
+import { Watch } from './decorators/Watch'
+
+export default class Comp2 extends Base {
+
+  @Watch('config.name')
+  public onNameChange() {
+    console.log('Comp2 name change==>', this.config.name)
+  }
+
+  public changeName() {
+    this.config.name = Math.random() + ''
+  }
+}
+</script>

example/src/decorators/Watch.ts

@@ -0,0 +1,20 @@
+import { WatchOptions } from 'vue'
+import { createDecorator, VueDecorator } from '../../../src'
+
+/**
+ * Decorator for watch options
+ * @param path the path or the expression to observe
+ * @param watchOptions
+ */
+export function Watch(path: string, watchOptions?: WatchOptions): VueDecorator {
+    return createDecorator((componentOptions, handler) => {
+        componentOptions.watch ||= Object.create(null)
+        const watch: any = componentOptions.watch
+        if (typeof watch[path] === 'object' && !Array.isArray(watch[path])) {
+            watch[path] = [watch[path]]
+        } else if (typeof watch[path] === 'undefined') {
+            watch[path] = []
+        }
+        watch[path].push({ handler, ...watchOptions })
+    })
+}

src/helpers.ts

@@ -36,6 +36,10 @@ export function createDecorator(
         : (target.constructor as VueConstructor)
     if (!Ctor.__d) {
       Ctor.__d = []
+      ;(Ctor.__d as any).__n = Ctor.name
+    } else if ((Ctor.__d as any).__n !== Ctor.name){
+      Ctor.__d = [].concat(Ctor.__d as [])
+      ;(Ctor.__d as any).__n = Ctor.name
     }
     if (typeof index !== 'number') {
       index = undefined

src/vue.ts

@@ -315,7 +315,6 @@ class VueImpl {
         options[key] = (Ctor as any)[key]
       }
     })
-
     return options
   }
 

yarn.lock

@@ -1352,11 +1352,6 @@
   dependencies:
     "@sinonjs/commons" "^1.7.0"
 
-"@types/anymatch@*":
-  version "1.3.1"
-  resolved "https://registry.yarnpkg.com/@types/anymatch/-/anymatch-1.3.1.tgz#336badc1beecb9dacc38bea2cf32adf627a8421a"
-  integrity sha512-/+CRPXpBDpo2RK9C68N3b2cOvO0Cf5B9aPijHsoDQTHivnGSObdOF2BRQOYjojWTDy6nQvMjmqRXIxH55VjxxA==
-
 "@types/[email protected]":
   version "1.0.38"
   resolved "https://registry.yarnpkg.com/@types/argparse/-/argparse-1.0.38.tgz#a81fd8606d481f873a3800c6ebae4f1d768a56a9"
@@ -1447,13 +1442,6 @@
   resolved "https://registry.yarnpkg.com/@types/json-schema/-/json-schema-7.0.6.tgz#f4c7ec43e81b319a9815115031709f26987891f0"
   integrity sha512-3c+yGKvVP5Y9TYBEibGNR+kLtijnj7mYrXRg+WpFb2X9xm04g/DXYkfg4hmzJQosc9snFNUPkbYIhu+KAm6jJw==
 
-"@types/mini-css-extract-plugin@^0.9.1":
-  version "0.9.1"
-  resolved "https://registry.yarnpkg.com/@types/mini-css-extract-plugin/-/mini-css-extract-plugin-0.9.1.tgz#d4bdde5197326fca039d418f4bdda03dc74dc451"
-  integrity sha512-+mN04Oszdz9tGjUP/c1ReVwJXxSniLd7lF++sv+8dkABxVNthg6uccei+4ssKxRHGoMmPxdn7uBdJWONSJGTGQ==
-  dependencies:
-    "@types/webpack" "*"
-
 "@types/minimist@^1.2.0":
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/@types/minimist/-/minimist-1.2.0.tgz#69a23a3ad29caf0097f06eda59b361ee2f0639f6"
@@ -1479,49 +1467,11 @@
   resolved "https://registry.yarnpkg.com/@types/prettier/-/prettier-2.1.0.tgz#5f96562c1075ee715a5b138f0b7f591c1f40f6b8"
   integrity sha512-hiYA88aHiEIgDmeKlsyVsuQdcFn3Z2VuFd/Xm/HCnGnPD8UFU5BM128uzzRVVGEzKDKYUrRsRH9S2o+NUy/3IA==
 
-"@types/source-list-map@*":
-  version "0.1.2"
-  resolved "https://registry.yarnpkg.com/@types/source-list-map/-/source-list-map-0.1.2.tgz#0078836063ffaf17412349bba364087e0ac02ec9"
-  integrity sha512-K5K+yml8LTo9bWJI/rECfIPrGgxdpeNbj+d53lwN4QjW1MCwlkhUms+gtdzigTeUyBr09+u8BwOIY3MXvHdcsA==
-
 "@types/stack-utils@^1.0.1":
   version "1.0.1"
   resolved "https://registry.yarnpkg.com/@types/stack-utils/-/stack-utils-1.0.1.tgz#0a851d3bd96498fa25c33ab7278ed3bd65f06c3e"
   integrity sha512-l42BggppR6zLmpfU6fq9HEa2oGPEI8yrSPL3GITjfRInppYFahObbIQOQK3UGxEnyQpltZLaPe75046NOZQikw==
 
-"@types/tapable@*":
-  version "1.0.6"
-  resolved "https://registry.yarnpkg.com/@types/tapable/-/tapable-1.0.6.tgz#a9ca4b70a18b270ccb2bc0aaafefd1d486b7ea74"
-  integrity sha512-W+bw9ds02rAQaMvaLYxAbJ6cvguW/iJXNT6lTssS1ps6QdrMKttqEAMEG/b5CR8TZl3/L7/lH0ZV5nNR1LXikA==
-
-"@types/uglify-js@*":
-  version "3.9.3"
-  resolved "https://registry.yarnpkg.com/@types/uglify-js/-/uglify-js-3.9.3.tgz#d94ed608e295bc5424c9600e6b8565407b6b4b6b"
-  integrity sha512-KswB5C7Kwduwjj04Ykz+AjvPcfgv/37Za24O2EDzYNbwyzOo8+ydtvzUfZ5UMguiVu29Gx44l1A6VsPPcmYu9w==
-  dependencies:
-    source-map "^0.6.1"
-
-"@types/webpack-sources@*":
-  version "1.4.2"
-  resolved "https://registry.yarnpkg.com/@types/webpack-sources/-/webpack-sources-1.4.2.tgz#5d3d4dea04008a779a90135ff96fb5c0c9e6292c"
-  integrity sha512-77T++JyKow4BQB/m9O96n9d/UUHWLQHlcqXb9Vsf4F1+wKNrrlWNFPDLKNT92RJnCSL6CieTc+NDXtCVZswdTw==
-  dependencies:
-    "@types/node" "*"
-    "@types/source-list-map" "*"
-    source-map "^0.7.3"
-
-"@types/webpack@*":
-  version "4.41.22"
-  resolved "https://registry.yarnpkg.com/@types/webpack/-/webpack-4.41.22.tgz#ff9758a17c6bd499e459b91e78539848c32d0731"
-  integrity sha512-JQDJK6pj8OMV9gWOnN1dcLCyU9Hzs6lux0wBO4lr1+gyEhIBR9U3FMrz12t2GPkg110XAxEAw2WHF6g7nZIbRQ==
-  dependencies:
-    "@types/anymatch" "*"
-    "@types/node" "*"
-    "@types/tapable" "*"
-    "@types/uglify-js" "*"
-    "@types/webpack-sources" "*"
-    source-map "^0.6.0"
-
 "@types/yargs-parser@*":
   version "15.0.0"
   resolved "https://registry.yarnpkg.com/@types/yargs-parser/-/yargs-parser-15.0.0.tgz#cb3f9f741869e20cce330ffbeb9271590483882d"
@@ -3046,6 +2996,13 @@ create-hmac@^1.1.0, create-hmac@^1.1.4, create-hmac@^1.1.7:
     safe-buffer "^5.0.1"
     sha.js "^2.4.8"
 
+cross-env@^7.0.3:
+  version "7.0.3"
+  resolved "https://registry.nlark.com/cross-env/download/cross-env-7.0.3.tgz?cache=0&sync_timestamp=1622605224328&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fcross-env%2Fdownload%2Fcross-env-7.0.3.tgz#865264b29677dc015ba8418918965dd232fc54cf"
+  integrity sha1-hlJkspZ33AFbqEGJGJZd0jL8VM8=
+  dependencies:
+    cross-spawn "^7.0.1"
+
 cross-spawn@^6.0.0, cross-spawn@^6.0.5:
   version "6.0.5"
   resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-6.0.5.tgz#4a5ec7c64dfae22c3a14124dbacdee846d80cbc4"
@@ -3057,10 +3014,10 @@ cross-spawn@^6.0.0, cross-spawn@^6.0.5:
     shebang-command "^1.2.0"
     which "^1.2.9"
 
-cross-spawn@^7.0.0:
+cross-spawn@^7.0.0, cross-spawn@^7.0.1:
   version "7.0.3"
-  resolved "https://registry.yarnpkg.com/cross-spawn/-/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6"
-  integrity sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==
+  resolved "https://registry.nlark.com/cross-spawn/download/cross-spawn-7.0.3.tgz#f73a85b9d5d41d045551c177e2882d4ac85728a6"
+  integrity sha1-9zqFudXUHQRVUcF34ogtSshXKKY=
   dependencies:
     path-key "^3.1.0"
     shebang-command "^2.0.0"
@@ -8116,17 +8073,14 @@ vm-browserify@^1.0.1:
   resolved "https://registry.yarnpkg.com/vm-browserify/-/vm-browserify-1.1.2.tgz#78641c488b8e6ca91a75f511e7a3b32a86e5dda0"
   integrity sha512-2ham8XPWTONajOR0ohOKOHXkm3+gaBmGut3SRuu75xLd/RRaY6vqgh8NBYYk7+RW3u5AtzPQZG8F10LHkl0lAQ==
 
-vue-loader@^16.0.0-beta.5:
-  version "16.0.0-beta.7"
-  resolved "https://registry.yarnpkg.com/vue-loader/-/vue-loader-16.0.0-beta.7.tgz#6f2726fa0e2b1fbae67895c47593bbf69f2b9ab8"
-  integrity sha512-xQ8/GZmRPdQ3EinnE0IXwdVoDzh7Dowo0MowoyBuScEBXrRabw6At5/IdtD3waKklKW5PGokPsm8KRN6rvQ1cw==
+vue-loader@^16.1.1:
+  version "16.8.1"
+  resolved "https://registry.npmmirror.com/vue-loader/download/vue-loader-16.8.1.tgz#354f12bc0897954158b71590f800295713a7792d"
+  integrity sha1-NU8SvAiXlUFYtxWQ+AApVxOneS0=
   dependencies:
-    "@types/mini-css-extract-plugin" "^0.9.1"
-    chalk "^3.0.0"
+    chalk "^4.1.0"
     hash-sum "^2.0.0"
-    loader-utils "^1.2.3"
-    merge-source-map "^1.1.0"
-    source-map "^0.6.1"
+    loader-utils "^2.0.0"
 
 vue@^3.0.0:
   version "3.0.0"