VUE-yandex-map 'ymaps' is not defined
Я пытаюсь подключить яндекс карты в VUE3 Создал отдельный Vue компонент
<template>
<div id="map" style="width: 1500px; height: 500px"></div>
</template>
<script>
import { loadYmap } from "vue-yandex-maps";
export default {
async created() {
const map_settings = {
apiKey: "",
lang: "ru_RU",
coordorder: "latlong",
version: "2.1",
};
await loadYmap({ map_settings, debug: true });
ymaps.ready(() => {
var myPlacemark,
myMap = new ymaps.Map(
"map",
{
center: [55.753994, 37.622093],
zoom: 7,
},
{
searchControlProvider: "yandex#search",
}
);
// Слушаем клик на карте.
myMap.events.add("click", function(e) {
var coords = e.get("coords");
document.getElementById("mark_coord").value = coords;
// Если метка уже создана – просто передвигаем ее.
if (myPlacemark) {
myPlacemark.geometry.setCoordinates(coords);
}
// Если нет – создаем.
else {
myPlacemark = createPlacemark(coords);
myMap.geoObjects.add(myPlacemark);
// Слушаем событие окончания перетаскивания на метке.
myPlacemark.events.add("dragend", function() {
getAddress(myPlacemark.geometry.getCoordinates());
});
}
getAddress(coords);
});
// Создание метки.
function createPlacemark(coords) {
return new ymaps.Placemark(
coords,
{
iconCaption: "здесь ваша точка",
},
{
preset: "islands#violetDotIconWithCaption",
draggable: true,
}
);
}
// Определяем адрес по координатам (обратное геокодирование).
function getAddress() {
myPlacemark.properties.set("iconCaption", "солнечная электростанция");
/* ymaps.geocode(coords).then(function (res) {
myPlacemark.properties
.set({
"sfdgfhgjk":"sfdgfhg"
});
});*/
}
});
},
};
</script>
Но получаю эту ошибку
16:5 error 'ymaps' is not defined no-undef
18:21 error 'ymaps' is not defined no-undef
49:20 error 'ymaps' is not defined no-undef
В чём проблема?