created: 2024-07-10T11:10:27.290Z

Electron Forge で react を使い始める

基本的にはドキュメントに書いてあることだが、そんなに親切にも書いてないので差分をメモっておく。

tsconfig.json

jsx を追加。

    ...
     "outDir": "dist",
+    "jsx": "react-jsx",
     "moduleResolution": "node",
    ...

client/App.tsx を作る

+// あくまで動作確認なので最低限。
+import { createRoot } from "react-dom/client";
+createRoot(document.getElementById("app")).render(<p>test</p>);
  • もちろん index.html に #app の DOM を追加しておく必要はある
  • 個人的な好みで client というディレクトリを掘ったが、必須ではない

renderer.ts で import

+import "./client/App";

拡張子はいらなかった。

所感

自動生成された webpack.config.js になんか追加しようとすると面倒なのを踏むことが多いけど簡単に動いてよかった。

なぜか結果を出す人が勉強以前にやっていること
[ad] なぜか結果を出す人が勉強以前にやっていること
チームドラゴン桜 (単行本)