Problems with implementing Factory pattern

I am trying to implement the factory pattern in Javascript and Vue.js, but running in to some problems.

This results in the error Error in v-on handler: "TypeError: this.factory.createShape is not a function" What am I doing wrong here?

This is my implementation:

shapeFactory.js

import Rectangle from '../models/shapes/rectangle';

class ShapeFactory {
    static createShape(data, type) {
        switch (type) {
            case "rect":
                return new Rectangle(data, type);
        }
    }
}

export default ShapeFactory;

Rectangle.js

function Rectangle(data, type) {
    new fabric.Rect({
        id: data.id,
        fill: data.comp.defaultColor,
        width: data.comp.defaultSize.width,
        height: data.comp.defaultSize.length,
        snapAngle: 15,
        lockMovementX: false,
        lockMovementY: false,
        visible: true,
        lockScalingFlip: true,
        hasControls: true,
        transparentCorners: false,
        cornerSize: 11,
        cornerColor: 'gray',
        cornerStyle: 'circle',
        noScaleCache: false,
        strokeWidth: 0
    })
}

parts of my Vue Component

import ShapeFactory from '../plugins/shapeFactory';

data: function () {
    return {
        factory: null
    };
},

init() {
    this.$refs['image'].style.backgroundImage = 'url(' + this.component.defProduct.cover.media.url + ')';
    this.factory = new ShapeFactory();
},

'shape': this.factory.createShape({id: id, comp: comp}, 'rect')