Nuxt + TypeScript + Google Maps API - プログラミングTips

Nuxt + TypeScriptで、Google Maps APIを使おうとするとエラーに遭遇。

例えばこのようにgoogle.maps.*を使おうとすると

let map: google.maps.Map

このようにエラーが出る。

Cannot find namespace 'google'.

@types/googlemaps Nodeパッケージをインストール

yarn add @types/googlemaps --dev

Nuxtプロジェクトのルートディレクトリにある tsconfig.json を修正。

"types": [
     "@types/node",
     "@nuxt/types",
     "@types/googlemaps"  これを追加
]

これでエラーが出なくなりました。

ただGoogleではない第三者のDefinitelyTypedという組織がメンテナンスしていることに注意。この組織はいろんなライブラリの型定義のパッケージを作ってますが、精度が低いと指摘している記事も見かけました。

でもGoogle本家のドキュメントで、このパッケージのインストールを紹介している。

大丈夫かな？問題が起きたらまた考えよう。