javascriptファイルをtypescriptに変更したことによるエラーを解決したい

Question

javasciptファイルをtypescriptファイルに変更したところ以下の箇所でエラーになりました。

window.toggleModal = function toggleModal(modal_id){
}

any
Property 'toggleModal' does not exist on type 'Window & typeof globalThis'.ts(2339)

ググってみましたが、いまひとつどのように書き直せば良いのか分かりません。
モーダルを開く処理です。
当方Typescript初心者です。
何かお分かりの方いらっしゃいましたら、よろしくお願い致します。

Comments

[hoshi-takanori]

これかな。
https://qiita.com/naotiki/items/1b5b99e99c93d0be14df

[m.ts10806]

>javasciptファイルをtypescriptファイルに変更した
具体的に何をどう変更したのか記載してください。
というか、言語体系など全く一緒でないはずなので、
１から構文あわせて組みなおすようにしないといけないのでは。

[miyuki-glass]

URLありがとうございます。
railsプロジェクトの中で、asset内のjsファイルの拡張子を.tsに変更した感じです。

[m.ts10806]

質問は編集できます。
何をどう調べたのかも含めて質問内容調整してください。

Answer 1

windowオブジェクトにはtoggleModalなんていうプロパティはありませんというエラーで、プロパティを好き勝手に登録できないように、型システムが防御しています。型言語としては健全な挙動だと思います。

windowに自前のプロパティを色々と生やしたい場合は、型を拡張する必要があります。tsconfig.jsonのcompilerOptionsのlibに"DOM"が指定されているかどうかで、対処方法が変わってきたりするのですが、
とりあえず拡張子がd.tsとなる下記内容の型定義ファイルを用意して、Windowインターフェースを拡張します。

declare global {
  interface Window {
    toggleModal(modal_id:string):void
  }
}

tsconfig.jsonのfiles(配列)に上記型定義ファイルを指定するのですが、このあたりの設定はtypescript declare window等のキーワードでググると多くの優れた情報が出てきますので、自分の回答としてはヒントとということで、ここまでとします。

Comments

[miyuki-glass]

ありがとうございます！