みかづきブログ・カスタム

基本的にはちょちょいのほいです。

Three.js(r127) + TypeScriptでの開発で「Property 'updateProjectionMatrix' does not exist on type 'PerspectiveCamera'.ts(2339)」を解決する 📦

ことの発端

TypeScript + Three.js(r127)での開発で、

const camera = new THREE.PerspectiveCamera();

camera.updateProjectionMatrix();

というコードを書いたところ、

Property 'updateProjectionMatrix' does not exist on type 'PerspectiveCamera'.ts(2339)

というエラーが出ました。

あれ?PerspectiveCameraにupdateProjectionMatrixなかったかな?と思い、ドキュメントを確認してみると、やっぱりありました。

threejs.org

試しに、最新のThree.js(r136)で試してみると、しっかりエラーが消えたので、r127の型推論が間違っていることが原因っぽいです。
今回は、訳あってr128以上のThree.jsを使うわけにはいかず、どうしたものかと対策を考えました。

対策

declare module '~/scripts/build/three.module' {
  interface PerspectiveCamera {
    updateProjectionMatrix(): void;
  }
}

const camera = new THREE.PerspectiveCamera();

camera.updateProjectionMatrix();

とアンビエント宣言を使うことでエラーを消すことができました。今回はこれで対応していこうと思います。