diff --git a/package.json b/package.json index 2bf6cce..11d1ba1 100644 --- a/package.json +++ b/package.json @@ -35,6 +35,11 @@ "devDependencies": { "@types/chai": "^3.4.34", "@types/mocha": "^2.2.32", + "babel-core": "^6.18.2", + "babel-loader": "^6.2.7", + "babel-plugin-transform-class-properties": "^6.18.0", + "babel-plugin-transform-decorators-legacy": "^1.3.4", + "babel-preset-es2015": "^6.18.0", "chai": "^3.5.0", "mocha": "^3.1.2", "node-libs-browser": "^1.0.0", diff --git a/src/component.ts b/src/component.ts index cf260f3..5b16b09 100644 --- a/src/component.ts +++ b/src/component.ts @@ -65,8 +65,12 @@ export function componentFactory ( // find super const superProto = Object.getPrototypeOf(Component.prototype) - const Super: VueClass = superProto instanceof Vue - ? superProto.constructor as VueClass - : Vue - return Super.extend(options) + if (!(superProto instanceof Vue)) { + Component.prototype = Object.create(Vue.prototype) + Component.prototype.constructor = Component + Object.keys(Vue).forEach(key => { + Component[key] = Vue[key] + }) + } + return Component.extend(options) } diff --git a/test/.babelrc b/test/.babelrc new file mode 100644 index 0000000..ba6b11f --- /dev/null +++ b/test/.babelrc @@ -0,0 +1,9 @@ +{ + "presets": [ + ["es2015", {"modules": false}] + ], + "plugins": [ + "transform-decorators-legacy", + "transform-class-properties" + ] +} \ No newline at end of file diff --git a/test/test-babel.js b/test/test-babel.js new file mode 100644 index 0000000..a722de4 --- /dev/null +++ b/test/test-babel.js @@ -0,0 +1,20 @@ +import Component from '../lib/index' +import { expect } from 'chai' +import Vue from 'vue' + +describe('vue-class-component with Babel', () => { + it('should be instantiated without any errors', () => { + @Component + class MyComp {} + expect(() => new MyComp()).to.not.throw(Error) + }) + + it('should collect class properties as data', () => { + @Component + class MyComp { + foo = 'hello' + } + const c = new MyComp() + expect(c.foo).to.equal('hello') + }) +}) \ No newline at end of file diff --git a/test/webpack.config.js b/test/webpack.config.js index 97ffd04..9848515 100644 --- a/test/webpack.config.js +++ b/test/webpack.config.js @@ -1,5 +1,8 @@ module.exports = { - entry: './test/test.ts', + entry: [ + './test/test.ts', + './test/test-babel.js' + ], output: { path: './test', filename: 'test.build.js' @@ -10,6 +13,11 @@ module.exports = { test: /\.ts$/, exclude: /node_modules|vue\/src/, loader: 'ts' + }, + { + test: /\.js$/, + exclude: /node_modules|vue\/src/, + loader: 'babel' } ] }