Cannot add VectorTile in OpenLayers 4

Question

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
        })
    });

Answer 1

Your issue is not related to OpenLayers but to the fact, you try to consume vector tiles using custom coordinates.

Custom tiles support is fine for EPSG 3857 but not for EPSG 32640 as stated in this answer from an OpenLayers dev