Как я могу использовать Jvectormap-Next с угловым 5

Question

Я пытаюсь внедрить jvectormap в мой угловой проект 5, но не могу.это то, что у меня есть в файле компонента:

Я использовал следующую команду для установки JVectormap-next:

npm install jvectormap-next --save

require('jvectormap-next')($); // <----- Error here 


// render the map
let gdpData = {
    'AF': 16.63,
    'AL': 11.58,
    'DZ': 158.97,
    // ...
}

$('#world-map-gdp').vectorMap({
    map: 'world_mill',
    series: {
        regions: [{
            values: gdpData,
            scale: ['#C8EEFF', '#0071A4'],
            normalizeFunction: 'polynomial'
        }]
    },
    onRegionTipShow: function(e, el, code){
        el.html(el.html()+' (GDP - '+gdpData[code]+')');
    }
});

и перед тегом @Component я также заявляю:

import "jvectormap-next";
declare var jquery:any;
declare var $ :any;

И это мой HTML-файл:

<div id="world-map" style="width: 600px; height: 400px;"></div>

Но я получаю ошибку впервая строка:

[ts] Идентификатор ожидается.

, но я не знаю, как я могу это решить, я на самом деле не так уж много использую JQuery, поэтомуможет быть, я делаю что-то, что действительно неправильно, я не знаю, если бы кто-то мог указать мне правильное направление, я был бы очень рад.Спасибо!