vue-class-component - npm Package Compare versions

Comparing version 6.1.2 to 6.2.0

dist/vue-class-component.common.js

 /**
-  * vue-class-component v6.1.2
-  * (c) 2015-2017 Evan You
+  * vue-class-component v6.2.0
+  * (c) 2015-present Evan You
   * @license MIT
@@ -29,2 +29,9 @@ */
 }
+function mixins() {
+    var Ctors = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        Ctors[_i] = arguments[_i];
+    }
+    return Vue.extend({ mixins: Ctors });
+}
 function isPrimitive(value) {
@@ -41,6 +48,9 @@ var type = typeof value;
 function collectDataFromConstructor(vm, Component) {
+    // override _init to prevent to init as Vue instance
     var originalInit = Component.prototype._init;
     Component.prototype._init = function () {
         var _this = this;
+        // proxy to actual vm
         var keys = Object.getOwnPropertyNames(vm);
+        // 2.2.0 compat (props are no longer exposed as self properties)
         if (vm.$options.props) {
@@ -63,4 +73,7 @@ for (var key in vm.$options.props) {
     };
+    // should be acquired class property values
     var data = new Component();
+    // restore original _init to avoid memory leak (#209)
     Component.prototype._init = originalInit;
+    // create plain data object
     var plainData = {};
@@ -94,3 +107,3 @@ Object.keys(data).forEach(function (key) {
     'render',
-    'errorCaptured'
+    'errorCaptured' // 2.5
 ];
@@ -100,2 +113,3 @@ function componentFactory(Component, options) {
     options.name = options.name || Component._componentTag || Component.name;
+    // prototype props.
     var proto = Component.prototype;
@@ -106,2 +120,3 @@ Object.getOwnPropertyNames(proto).forEach(function (key) {
         }
+        // hooks
         if ($internalHooks.indexOf(key) > -1) {
@@ -113,5 +128,7 @@ options[key] = proto[key];
         if (typeof descriptor.value === 'function') {
+            // methods
             (options.methods || (options.methods = {}))[key] = descriptor.value;
         }
         else if (descriptor.get || descriptor.set) {
+            // computed properties
             (options.computed || (options.computed = {}))[key] = {
@@ -128,2 +145,3 @@ get: descriptor.get,
     });
+    // decorate options
     var decorators = Component.__decorators__;
@@ -134,2 +152,3 @@ if (decorators) {
     }
+    // find super
     var superProto = Object.getPrototypeOf(Component.prototype);
@@ -144,4 +163,7 @@ var Super = superProto instanceof Vue
 var reservedPropertyNames = [
+    // Unique id
     'cid',
+    // Super Vue constructor
     'super',
+    // Component options that will be used by the component
     'options',
@@ -151,2 +173,3 @@ 'superOptions',
     'sealedOptions',
+    // Private assets
     'component',
@@ -157,6 +180,9 @@ 'directive',
 function forwardStaticMembers(Extended, Original, Super) {
+    // We have to use getOwnPropertyNames since Babel registers methods as non-enumerable
     Object.getOwnPropertyNames(Original).forEach(function (key) {
+        // `prototype` should not be overwritten
         if (key === 'prototype') {
             return;
         }
+        // Some browsers does not allow reconfigure built-in properties
         var extendedDescriptor = Object.getOwnPropertyDescriptor(Extended, key);
@@ -167,3 +193,13 @@ if (extendedDescriptor && !extendedDescriptor.configurable) {
         var descriptor = Object.getOwnPropertyDescriptor(Original, key);
+        // If the user agent does not support `__proto__` or its family (IE <= 10),
+        // the sub class properties may be inherited properties from the super class in TypeScript.
+        // We need to exclude such properties to prevent to overwrite
+        // the component options object which stored on the extended constructor (See #192).
+        // If the value is a referenced value (object or function),
+        // we can check equality of them and exclude it if they have the same reference.
+        // If it is a primitive value, it will be forwarded for safety.
         if (!hasProto) {
+            // Only `cid` is explicitly exluded from property forwarding
+            // because we cannot detect whether it is a inherited property or not
+            // on the no `__proto__` environment even though the property is reserved.
             if (key === 'cid') {
@@ -179,2 +215,3 @@ return;
         }
+        // Warn if the users manually declare reserved properties
         if (process.env.NODE_ENV !== 'production'
@@ -206,3 +243,4 @@ && reservedPropertyNames.indexOf(key) >= 0) {
 
-exports['default'] = Component$1;
+exports.default = Component$1;
 exports.createDecorator = createDecorator;
+exports.mixins = mixins;

dist/vue-class-component.js

 /**
-  * vue-class-component v6.1.2
-  * (c) 2015-2017 Evan You
+  * vue-class-component v6.2.0
+  * (c) 2015-present Evan You
   * @license MIT
@@ -29,2 +29,9 @@ */
 }
+function mixins() {
+    var Ctors = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        Ctors[_i] = arguments[_i];
+    }
+    return Vue.extend({ mixins: Ctors });
+}
 function isPrimitive(value) {
@@ -41,6 +48,9 @@ var type = typeof value;
 function collectDataFromConstructor(vm, Component) {
+    // override _init to prevent to init as Vue instance
     var originalInit = Component.prototype._init;
     Component.prototype._init = function () {
         var _this = this;
+        // proxy to actual vm
         var keys = Object.getOwnPropertyNames(vm);
+        // 2.2.0 compat (props are no longer exposed as self properties)
         if (vm.$options.props) {
@@ -63,4 +73,7 @@ for (var key in vm.$options.props) {
     };
+    // should be acquired class property values
     var data = new Component();
+    // restore original _init to avoid memory leak (#209)
     Component.prototype._init = originalInit;
+    // create plain data object
     var plainData = {};
@@ -94,3 +107,3 @@ Object.keys(data).forEach(function (key) {
     'render',
-    'errorCaptured'
+    'errorCaptured' // 2.5
 ];
@@ -100,2 +113,3 @@ function componentFactory(Component, options) {
     options.name = options.name || Component._componentTag || Component.name;
+    // prototype props.
     var proto = Component.prototype;
@@ -106,2 +120,3 @@ Object.getOwnPropertyNames(proto).forEach(function (key) {
         }
+        // hooks
         if ($internalHooks.indexOf(key) > -1) {
@@ -113,5 +128,7 @@ options[key] = proto[key];
         if (typeof descriptor.value === 'function') {
+            // methods
             (options.methods || (options.methods = {}))[key] = descriptor.value;
         }
         else if (descriptor.get || descriptor.set) {
+            // computed properties
             (options.computed || (options.computed = {}))[key] = {
@@ -128,2 +145,3 @@ get: descriptor.get,
     });
+    // decorate options
     var decorators = Component.__decorators__;
@@ -134,2 +152,3 @@ if (decorators) {
     }
+    // find super
     var superProto = Object.getPrototypeOf(Component.prototype);
@@ -144,4 +163,7 @@ var Super = superProto instanceof Vue
 var reservedPropertyNames = [
+    // Unique id
     'cid',
+    // Super Vue constructor
     'super',
+    // Component options that will be used by the component
     'options',
@@ -151,2 +173,3 @@ 'superOptions',
     'sealedOptions',
+    // Private assets
     'component',
@@ -157,6 +180,9 @@ 'directive',
 function forwardStaticMembers(Extended, Original, Super) {
+    // We have to use getOwnPropertyNames since Babel registers methods as non-enumerable
     Object.getOwnPropertyNames(Original).forEach(function (key) {
+        // `prototype` should not be overwritten
         if (key === 'prototype') {
             return;
         }
+        // Some browsers does not allow reconfigure built-in properties
         var extendedDescriptor = Object.getOwnPropertyDescriptor(Extended, key);
@@ -167,3 +193,13 @@ if (extendedDescriptor && !extendedDescriptor.configurable) {
         var descriptor = Object.getOwnPropertyDescriptor(Original, key);
+        // If the user agent does not support `__proto__` or its family (IE <= 10),
+        // the sub class properties may be inherited properties from the super class in TypeScript.
+        // We need to exclude such properties to prevent to overwrite
+        // the component options object which stored on the extended constructor (See #192).
+        // If the value is a referenced value (object or function),
+        // we can check equality of them and exclude it if they have the same reference.
+        // If it is a primitive value, it will be forwarded for safety.
         if (!hasProto) {
+            // Only `cid` is explicitly exluded from property forwarding
+            // because we cannot detect whether it is a inherited property or not
+            // on the no `__proto__` environment even though the property is reserved.
             if (key === 'cid') {
@@ -179,2 +215,3 @@ return;
         }
+        // Warn if the users manually declare reserved properties
         if ("development" !== 'production'
@@ -206,4 +243,5 @@ && reservedPropertyNames.indexOf(key) >= 0) {
 
-exports['default'] = Component$1;
+exports.default = Component$1;
 exports.createDecorator = createDecorator;
+exports.mixins = mixins;
 
@@ -210,0 +248,0 @@ Object.defineProperty(exports, '__esModule', { value: true });

dist/vue-class-component.min.js

 /**
-  * vue-class-component v6.1.2
-  * (c) 2015-2017 Evan You
+  * vue-class-component v6.2.0
+  * (c) 2015-present Evan You
   * @license MIT
   */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):t(e.VueClassComponent={},e.Vue)}(this,function(e,t){"use strict";function r(e){var t=typeof e;return null==e||"object"!==t&&"function"!==t}function o(e,t){var r=t.prototype._init;t.prototype._init=function(){var t=this,r=Object.getOwnPropertyNames(e);if(e.$options.props)for(var o in e.$options.props)e.hasOwnProperty(o)||r.push(o);r.forEach(function(r){"_"!==r.charAt(0)&&Object.defineProperty(t,r,{get:function(){return e[r]},set:function(t){return e[r]=t},configurable:!0})})};var o=new t;t.prototype._init=r;var n={};return Object.keys(o).forEach(function(e){void 0!==o[e]&&(n[e]=o[e])}),n}function n(e,r){void 0===r&&(r={}),r.name=r.name||e._componentTag||e.name;var n=e.prototype;Object.getOwnPropertyNames(n).forEach(function(e){if("constructor"!==e)if(f.indexOf(e)>-1)r[e]=n[e];else{var t=Object.getOwnPropertyDescriptor(n,e);"function"==typeof t.value?(r.methods||(r.methods={}))[e]=t.value:(t.get||t.set)&&((r.computed||(r.computed={}))[e]={get:t.get,set:t.set})}}),(r.mixins||(r.mixins=[])).push({data:function(){return o(this,e)}});var i=e.__decorators__;i&&(i.forEach(function(e){return e(r)}),delete e.__decorators__);var u=Object.getPrototypeOf(e.prototype),a=u instanceof t?u.constructor:t,p=a.extend(r);return c(p,e,a),p}function c(e,t,o){Object.getOwnPropertyNames(t).forEach(function(n){if("prototype"!==n){var c=Object.getOwnPropertyDescriptor(e,n);if(!c||c.configurable){var i=Object.getOwnPropertyDescriptor(t,n);if(!u){if("cid"===n)return;var f=Object.getOwnPropertyDescriptor(o,n);if(!r(i.value)&&f&&f.value===i.value)return}Object.defineProperty(e,n,i)}}})}function i(e){return"function"==typeof e?n(e):function(t){return n(t,e)}}t=t&&t.hasOwnProperty("default")?t.default:t;var u={__proto__:[]}instanceof Array,f=["data","beforeCreate","created","beforeMount","mounted","beforeDestroy","destroyed","beforeUpdate","updated","activated","deactivated","render","errorCaptured"];!function(e){e.registerHooks=function(e){f.push.apply(f,e)}}(i||(i={}));var a=i;e.default=a,e.createDecorator=function(e){return function(t,r,o){var n="function"==typeof t?t:t.constructor;n.__decorators__||(n.__decorators__=[]),"number"!=typeof o&&(o=void 0),n.__decorators__.push(function(t){return e(t,r,o)})}},Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],t):t(e.VueClassComponent={},e.Vue)}(this,function(e,t){"use strict";t=t&&t.hasOwnProperty("default")?t.default:t;var r={__proto__:[]}instanceof Array;var o=["data","beforeCreate","created","beforeMount","mounted","beforeDestroy","destroyed","beforeUpdate","updated","activated","deactivated","render","errorCaptured"];function n(e,n){void 0===n&&(n={}),n.name=n.name||e._componentTag||e.name;var i=e.prototype;Object.getOwnPropertyNames(i).forEach(function(e){if("constructor"!==e)if(o.indexOf(e)>-1)n[e]=i[e];else{var t=Object.getOwnPropertyDescriptor(i,e);"function"==typeof t.value?(n.methods||(n.methods={}))[e]=t.value:(t.get||t.set)&&((n.computed||(n.computed={}))[e]={get:t.get,set:t.set})}}),(n.mixins||(n.mixins=[])).push({data:function(){return function(e,t){var r=t.prototype._init;t.prototype._init=function(){var t=this,r=Object.getOwnPropertyNames(e);if(e.$options.props)for(var o in e.$options.props)e.hasOwnProperty(o)||r.push(o);r.forEach(function(r){"_"!==r.charAt(0)&&Object.defineProperty(t,r,{get:function(){return e[r]},set:function(t){return e[r]=t},configurable:!0})})};var o=new t;t.prototype._init=r;var n={};return Object.keys(o).forEach(function(e){void 0!==o[e]&&(n[e]=o[e])}),n}(this,e)}});var c=e.__decorators__;c&&(c.forEach(function(e){return e(n)}),delete e.__decorators__);var u,a,f,p=Object.getPrototypeOf(e.prototype),s=p instanceof t?p.constructor:t,d=s.extend(n);return u=d,a=e,f=s,Object.getOwnPropertyNames(a).forEach(function(e){if("prototype"!==e){var t=Object.getOwnPropertyDescriptor(u,e);if(!t||t.configurable){var o,n,i=Object.getOwnPropertyDescriptor(a,e);if(!r){if("cid"===e)return;var c=Object.getOwnPropertyDescriptor(f,e);if(o=i.value,n=typeof o,null!=o&&("object"===n||"function"===n)&&c&&c.value===i.value)return}Object.defineProperty(u,e,i)}}}),d}function i(e){return"function"==typeof e?n(e):function(t){return n(t,e)}}!function(e){(i||(i={})).registerHooks=function(e){o.push.apply(o,e)}}();var c=i;e.default=c,e.createDecorator=function(e){return function(t,r,o){var n="function"==typeof t?t:t.constructor;n.__decorators__||(n.__decorators__=[]),"number"!=typeof o&&(o=void 0),n.__decorators__.push(function(t){return e(t,r,o)})}},e.mixins=function(){for(var e=[],r=0;r<arguments.length;r++)e[r]=arguments[r];return t.extend({mixins:e})},Object.defineProperty(e,"__esModule",{value:!0})});

lib/component.js

@@ -17,3 +17,3 @@ import Vue from 'vue';
     'render',
-    'errorCaptured'
+    'errorCaptured' // 2.5
 ];
@@ -23,2 +23,3 @@ export function componentFactory(Component, options) {
     options.name = options.name || Component._componentTag || Component.name;
+    // prototype props.
     var proto = Component.prototype;
@@ -29,2 +30,3 @@ Object.getOwnPropertyNames(proto).forEach(function (key) {
         }
+        // hooks
         if ($internalHooks.indexOf(key) > -1) {
@@ -36,5 +38,7 @@ options[key] = proto[key];
         if (typeof descriptor.value === 'function') {
+            // methods
             (options.methods || (options.methods = {}))[key] = descriptor.value;
         }
         else if (descriptor.get || descriptor.set) {
+            // computed properties
             (options.computed || (options.computed = {}))[key] = {
@@ -51,2 +55,3 @@ get: descriptor.get,
     });
+    // decorate options
     var decorators = Component.__decorators__;
@@ -57,2 +62,3 @@ if (decorators) {
     }
+    // find super
     var superProto = Object.getPrototypeOf(Component.prototype);
@@ -67,4 +73,7 @@ var Super = superProto instanceof Vue
 var reservedPropertyNames = [
+    // Unique id
     'cid',
+    // Super Vue constructor
     'super',
+    // Component options that will be used by the component
     'options',
@@ -74,2 +83,3 @@ 'superOptions',
     'sealedOptions',
+    // Private assets
     'component',
@@ -80,6 +90,9 @@ 'directive',
 function forwardStaticMembers(Extended, Original, Super) {
+    // We have to use getOwnPropertyNames since Babel registers methods as non-enumerable
     Object.getOwnPropertyNames(Original).forEach(function (key) {
+        // `prototype` should not be overwritten
         if (key === 'prototype') {
             return;
         }
+        // Some browsers does not allow reconfigure built-in properties
         var extendedDescriptor = Object.getOwnPropertyDescriptor(Extended, key);
@@ -90,3 +103,13 @@ if (extendedDescriptor && !extendedDescriptor.configurable) {
         var descriptor = Object.getOwnPropertyDescriptor(Original, key);
+        // If the user agent does not support `__proto__` or its family (IE <= 10),
+        // the sub class properties may be inherited properties from the super class in TypeScript.
+        // We need to exclude such properties to prevent to overwrite
+        // the component options object which stored on the extended constructor (See #192).
+        // If the value is a referenced value (object or function),
+        // we can check equality of them and exclude it if they have the same reference.
+        // If it is a primitive value, it will be forwarded for safety.
         if (!hasProto) {
+            // Only `cid` is explicitly exluded from property forwarding
+            // because we cannot detect whether it is a inherited property or not
+            // on the no `__proto__` environment even though the property is reserved.
             if (key === 'cid') {
@@ -102,2 +125,3 @@ return;
         }
+        // Warn if the users manually declare reserved properties
         if (process.env.NODE_ENV !== 'production'
@@ -104,0 +128,0 @@ && reservedPropertyNames.indexOf(key) >= 0) {

lib/data.js

 import Vue from 'vue';
 import { warn } from './util';
 export function collectDataFromConstructor(vm, Component) {
+    // override _init to prevent to init as Vue instance
     var originalInit = Component.prototype._init;
     Component.prototype._init = function () {
         var _this = this;
+        // proxy to actual vm
         var keys = Object.getOwnPropertyNames(vm);
+        // 2.2.0 compat (props are no longer exposed as self properties)
         if (vm.$options.props) {
@@ -25,4 +28,7 @@ for (var key in vm.$options.props) {
     };
+    // should be acquired class property values
     var data = new Component();
+    // restore original _init to avoid memory leak (#209)
     Component.prototype._init = originalInit;
+    // create plain data object
     var plainData = {};
@@ -29,0 +35,0 @@ Object.keys(data).forEach(function (key) {

lib/declarations.d.ts

 import Vue, { ComponentOptions } from 'vue';
-export declare type VueClass<V extends Vue> = {
-    new (...args: any[]): V;
+export declare type VueClass<V> = {
+    new (...args: any[]): V & Vue;
 } & typeof Vue;
@@ -5,0 +5,0 @@ export declare type DecoratedClass = VueClass<Vue> & {

lib/index.d.ts

 import Vue, { ComponentOptions } from 'vue';
 import { VueClass } from './declarations';
-export { createDecorator, VueDecorator } from './util';
+export { createDecorator, VueDecorator, mixins } from './util';
 declare function Component<V extends Vue>(options: ComponentOptions<V> & ThisType<V>): <VC extends VueClass<V>>(target: VC) => VC;
@@ -5,0 +5,0 @@ declare function Component<VC extends VueClass<Vue>>(target: VC): VC;

lib/index.js

 import { componentFactory, $internalHooks } from './component';
-export { createDecorator } from './util';
+export { createDecorator, mixins } from './util';
 function Component(options) {
@@ -4,0 +4,0 @@ if (typeof options === 'function') {

lib/util.d.ts

 import Vue, { ComponentOptions } from 'vue';
+import { VueClass } from './declarations';
 export declare const noop: () => void;
@@ -10,3 +11,9 @@ export declare const hasProto: boolean;
 export declare function createDecorator(factory: (options: ComponentOptions<Vue>, key: string, index: number) => void): VueDecorator;
+export declare function mixins<A>(CtorA: VueClass<A>): VueClass<A>;
+export declare function mixins<A, B>(CtorA: VueClass<A>, CtorB: VueClass<B>): VueClass<A & B>;
+export declare function mixins<A, B, C>(CtorA: VueClass<A>, CtorB: VueClass<B>, CtorC: VueClass<C>): VueClass<A & B & C>;
+export declare function mixins<A, B, C, D>(CtorA: VueClass<A>, CtorB: VueClass<B>, CtorC: VueClass<C>, CtorD: VueClass<D>): VueClass<A & B & C & D>;
+export declare function mixins<A, B, C, D, E>(CtorA: VueClass<A>, CtorB: VueClass<B>, CtorC: VueClass<C>, CtorD: VueClass<D>, CtorE: VueClass<E>): VueClass<A & B & C & D & E>;
+export declare function mixins<T>(...Ctors: VueClass<Vue>[]): VueClass<T>;
 export declare function isPrimitive(value: any): boolean;
 export declare function warn(message: string): void;

lib/util.js

@@ -0,1 +1,2 @@
+import Vue from 'vue';
 export var noop = function () { };
@@ -17,2 +18,9 @@ export var hasProto = { __proto__: [] } instanceof Array;
 }
+export function mixins() {
+    var Ctors = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        Ctors[_i] = arguments[_i];
+    }
+    return Vue.extend({ mixins: Ctors });
+}
 export function isPrimitive(value) {
@@ -19,0 +27,0 @@ var type = typeof value;

package.json

 {
   "name": "vue-class-component",
-  "version": "6.1.2",
+  "version": "6.2.0",
   "description": "ES201X/TypeScript class decorator for Vue components",
@@ -39,24 +39,27 @@ "main": "dist/vue-class-component.common.js",
   "devDependencies": {
-    "@types/chai": "^4.0.1",
-    "@types/mocha": "^2.2.41",
-    "babel-core": "^6.25.0",
-    "babel-loader": "^7.1.1",
+    "@types/chai": "^4.1.2",
+    "@types/mocha": "^2.2.48",
+    "babel-core": "^6.26.0",
+    "babel-helper-vue-jsx-merge-props": "^2.0.3",
+    "babel-loader": "^7.1.2",
+    "babel-plugin-syntax-jsx": "^6.18.0",
     "babel-plugin-transform-class-properties": "^6.24.1",
     "babel-plugin-transform-decorators-legacy": "^1.3.4",
+    "babel-plugin-transform-vue-jsx": "^3.5.1",
     "babel-preset-es2015": "^6.24.1",
-    "chai": "^4.0.2",
-    "css-loader": "^0.28.4",
-    "mocha": "^4.0.1",
-    "rimraf": "^2.6.1",
-    "rollup": "^0.50.0",
+    "chai": "^4.1.2",
+    "css-loader": "^0.28.9",
+    "mocha": "^5.0.1",
+    "rimraf": "^2.6.2",
+    "rollup": "^0.55.5",
     "rollup-plugin-replace": "^2.0.0",
-    "testdouble": "^3.2.1",
-    "ts-loader": "^2.2.1",
-    "typescript": "^2.5.2",
-    "uglify-js": "^3.0.22",
-    "vue": "^2.5.0",
-    "vue-loader": "^13.0.0",
-    "vue-template-compiler": "^2.5.0",
-    "webpack": "^3.0.0"
+    "testdouble": "^3.5.0",
+    "ts-loader": "^3.5.0",
+    "typescript": "^2.7.1",
+    "uglify-js": "^3.3.10",
+    "vue": "^2.5.13",
+    "vue-loader": "^14.1.1",
+    "vue-template-compiler": "^2.5.13",
+    "webpack": "^3.11.0"
   }
 }

README.md

@@ -79,2 +79,36 @@ # vue-class-component
 
+### Using Mixins
+
+vue-class-component provides `mixins` helper function to use [mixins](https://vuejs.org/v2/guide/mixins.html) in class style manner. By using `mixins` helper, TypeScript can infer mixin types and inherit them on the component type.
+
+Example of declaring a mixin:
+
+``` js
+// mixin.js
+import Vue from 'vue'
+import Component from 'vue-class-component'
+
+// You can declare a mixin as the same style as components.
+@Component
+export class MyMixin extends Vue {
+  mixinValue = 'Hello'
+}
+```
+
+Example of using a mixin:
+
+``` js
+import Component, { mixins } from 'vue-class-component'
+import MyMixin from './mixin.js'
+
+// Use `mixins` helper function instead of `Vue`.
+// `mixins` can receive any number of arguments.
+@Component
+export class MyComp extends mixins(MyMixin) {
+  created () {
+    console.log(this.mixinValue) // -> Hello
+  }
+}
+```
+
 ### Create Custom Decorators
@@ -81,0 +115,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

39590

increased by23.14%

Lines of code

716

increased by20.34%

Number of lines in readme file

271

increased by14.35%

Worsened metrics

Dev dependency count

24

increased by14.29%

No dependency changes