Can't add VectorTile in Openlayers 4

I’m trying to add a vector tile layer in my app using Openlayers 4 , but I’m getting the error as follows ,

ol.js:753 Uncaught TypeError: a.replace is not a function
Here is my code to add the vector tile layer,

var vectorSource = new ol.layer.VectorTile({
        declutter: true,
        source: new ol.source.VectorTile({
            format: new ol.format.GeoJSON(),
            url: function (extent) {                        
                return 'http://localhost:8080/geoserver/myworkspace/wms?service=WMS&version=1.1.0&request=GetMap&layers=myworkspace:bdms_building&styles=&bbox=227227.0625,2664047.75,300691.15625,2745836.25&width=689&height=768&srs=EPSG:32640&format=application/x-protobuf;type=mapbox-vector&' +
                    'bbox=' + extent.join(',') + ',EPSG:32640';
            }
        }),

    });



        proj4.defs("EPSG:32640", "+proj=utm +zone=40 +datum=WGS84 +units=m +no_defs");
        var map = new ol.Map({
        target: 'map',
        controls: ol.control.defaults({
            attributionOptions: {
                collapsible: false
            }
        }).extend([
            new ol.control.ZoomToExtent({
                extent: [
                    227227.0625, 2664047.75,
                    300691.15625, 2745836.25
                ]
            })
        ]),
        interactions: [
            interactionSelectPointerMove,
            new ol.interaction.MouseWheelZoom(),
            new ol.interaction.DragPan()
        ],
        layers: [               
            vectorSource
        ],
        view: new ol.View({
            center: [227227.0625, 2664047.75],
            projection: 'EPSG:32640',
            maxZoom: 19,
            zoom: 13
        })
    });