Есть ли какой-либо пакет на npm для карт Google? Или я действительно предположительно, чтобы вставить этот
<script src="https://maps.googleapis.com/maps/api/jskey=YOUR_API_KEY">
</script>
в мой index.html и загрузите этот js файл при каждом обновлении?
Это очень раздражает, потому что иногда я получаю ReferenceError: google is not defined.
Официальный пакет карт Google (@google/maps) предназначен только для узлов. В среде браузера вам необходимо использовать неофициальный пакет или включить официальный скрипт на свой сайт.
При возникновении проблемы ReferenceError убедитесь, что тег script для карт Google находится над тегом script для вашего кода, чтобы он сначала загружался. Если это не так, ваш сценарий может быть запущен до создания глобальной переменной Google.
Один неофициальный пакет - google-maps, который можно использовать в браузере.
ReferenceError, который вы получаете, вероятно, потому, что вы неправильно вызываете библиотеку.
В Документация Google предполагает, что вы должны указать обратный вызов (например, initMap), который будет вызываться, когда API закончит загрузку. Все, что вам нужно сделать с Картой, должно идти в пределах этой функции, чтобы вы гарантировали загрузку API и google уже определен.
<script async defer
src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=initMap">
</script>
Да, есть несколько пакетов. Вы можете попробовать это.
Я столкнулся с той же проблемой, когда работал с React + TypeScript. Сначала я установил Google Maps SDK с этой строкой;
npm install @google/maps
Но компилятор TypeScript выдал ошибку, также предложил мне установить эту строку;
npm install @types/google__maps
и тогда это сработало.
import { createClient } from "@google/maps"
const googleMaps = createClient({
key: "YOUR_API_KEY"
})
Или я действительно должен вставить это в мой index.html и загружать этот js файл при каждом обновлении?
Да. Это единственный способ сделать это. Есть несколько пакетов, которые динамически делают это для вас, но поведение такое же.
Напомним, что нет официального пакета для загрузки JavaScript Карт Google для веб-среды на NPM. @google/maps, на который ссылаются другие, предназначен только для узла.
Я думаю, что Google-Map-API-загрузчик сделает работу