【Vite】型定義ファイルでwindowオブジェクトの型を宣言する

結論

1. vite-env.d.tsに型定義を追加
2. vite.config.tsにdefineオプションを追加

状況

windowプロパティが存在しない

プロパティ 'ENGINE_DATA' は型 'Window & typeof globalThis' に存在しません。

ENGINE_DATAというwindowプロパティを作って使っているが、型定義がない。

対応

vite-env.d.tsに型宣言

vite-env.d.ts

/// <reference types="vite/client" />
declare interface Window { //追加
  ENGINE_DATA: {
    scenes: any[];
    parameter: any;
    frame: number;
    id: number;
  };
}

これだけでエラーは解消。

vite.config.tsで定義

vite.config.ts

import { defineConfig } from 'vite';

export default defineConfig({
  define: {
    "window.ENGINE_DATA": JSON.stringify({
      scenes: [],
      parameter: null,
      frame: 0,
      id: 0,
    }),
  },
});

これもするらしいが、動作の意味はわからず。

参考

https://ja.vitejs.dev/config/shared-options.html#define