TypeScriptでGoogle Maps

さて、VS CodeでTypeScriptをかけるようになったら、次はGoogle MapsをTypeScriptでかきたい。

課題としてはGoogle Mapsにお絵描きだ。
はて？TypeScriptソース内にGoogle Maps JavaScript APIをどうやって導入すればいいんだろう、と思っていたら、AngularでGoogle Maps JavaScript APIを使っている投稿があるので参考にさせてもらう。

1. Install Google Maps types for typescript support

   npm install --save @types/googlemaps

2. Import the Google Maps types into component

   import {} from 'googlemaps';

3. 以下の１行を記載した新規TSファイル「index.d.ts」を設置

   declare module 'googlemaps';

これで、TypeScript内で「google.maps」が使えるようになった。

VS CodeのTypeScript動作確認でいきなりつまずく

今更ながら、VS CodeでTypeScriptでもやっちゃおうかなー、などと軽い気持ちでVS CodeのTerminalをたたく…

> npm install -g typescript

 動作確認は…か、

> tsc --version

tsc : このシステムではスクリプトの実行が無効になっているため、ファイル C:\Users\hogehoge\AppData\Roaming\npm\tsc.ps1 を読み
込むことができません。詳細については、「about_Execution_Policies」(https://go.microsoft.com/fwlink/?LinkID=135170) を参
照してください。
発生場所 行:1 文字:1
+ tsc --version
+ ~~~
    + CategoryInfo          : セキュリティ エラー: (: ) []、PSSecurityException
    + FullyQualifiedErrorId : UnauthorizedAccess 

なになに、デフォルトではWindowsのPowerShellスクリプト実行ポリシーによって実行が許可されていない…

https://attakei.net/blog/2019/windows-vscode-venv/index.html
ふーん、settings.jsonで、ターミナル起動時にPowerShellの実行ポリシーを変更できるのか…

{
  "terminal.integrated.env.windows": {
    "PSExecutionPolicyPreference": "RemoteSigned"
  }
}