エンジニア夫婦の技術日記

TODO作成ツール作ってみようpart3.5


2025年10月27日
Posted by 
向日葵

こんにちは。向日葵です。

今回はPC移行に伴うTODO作成ツールの環境構築について記事にしました。前回の投稿が2023年ということに驚きを隠せませんΣ(´∀`;)

環境構築スタート

ソース等はGitにあげているのでまずはクローンして起動するか確認しました。

エラーが発生しました。当然Nodeはインストールしましたし、npm installで必要なものはインストールしました。ここで私は一つの仮説をたてました。

Nodeのバージョンが高すぎるのではないか?

package.jsonでElectronのバージョンを確認し検索したところ、やはりインストールしたNodeのバージョンがサポートされていないことがわかりました。

Electronの最新バージョンは10/25時点でv38.4.0になり、Nodeのバージョンはv22.20.0のようです。

リリースノート

インストールされているNodeのバージョンがv22.21.0のためNodeのバージョンを下げる必要がありそうです。

もろもろのインストールをしていくよ

nvm

今後のことも考えてNodeを複数バージョン管理できるようにしたいと思います。そのためnvmのインストールをします。

nvmは簡単に言うとNodeのバージョン管理を行うツールです。

こちらの記事を参考にインストールしました。

Node

次にNodeのv22.20.0のインストールを行います。

以下コマンドを実行します。

nvm install 22.20.0

無事Nodeのv22.20.0がインストールできました。

Electron

次にElectronをアンインストールします。

以下のコマンドを実行します。

npm uninstall electron

最後にElectronのv38.4.0をインストールします。

以下のコマンドを実行します。

npm install –save-dev electron@38.4.0

package.jsonを確認してElectronのバージョンが38.4.0になっていることを確認します。

再度実行してみた

この状態で再度実行してみましょう。

変わりません。chatGPTに聞いたところ、以下のコマンドの実行を提案されました。

npx electron .

実行すると起動できました。

npxは何者?

npxについて調べると興味深い記事を見つけました。

【Node.js入門】npmとnpxの違い

npxは一時的な実行らしいです。グローバルインストールすれば実行できると思いますが、他のプロジェクトでバージョンの違いなどが出る可能性があるためあまりしたくありません。

ふと今までnodeを使ったアプリを実行するときに「npm start」や「npm run」を行っていたことを思い出しました。早速試してみましょう。

package.jsonにstartを追加しました。

実行してみます。

実行できました!ということで無事PC移行に伴う環境構築は完了です。

おわり

最後まで見ていただきありがとうございます。今回の件で今までの経験が活かされていることが実感でき、自身の成長を嬉しく思いました。

コメントを書く