はじめに
おもちゃ作りと学習を兼ねて、Vue3とQuasarやってみようと思い立ちました。そこで、Vue公式のクイックスタートに従って、ぽちぽちコマンドを実行していたのですが、
npm run dev上のコマンドを実行したところタイトルのエラー「can not find module node:url」が出てげんなりした、という話です。
※今回の記事はQuasar全く出ません。
実行環境
- Windows 10
特筆するものはこれくらいかなぁ。
原因と解決策
原因
viteを起動しようとしていたのですが、自PCにインストールされているnodeのバージョンが古かったのでタイトルのエラーが出てしまいました。Windows環境のnodeバージョンが「12.X」とか古のモノになっていたのが原因です。。
viteのガイドを見ると、「ViteはNode.js 14.18+、16+のバージョンが必要です。」ってしっかり書かれておりました。
解決策
原因はnodeが古いことなので、単純にnodeのバージョンをアップデートしましょう。
nodeのアップデート
前述の通り、Windowsで作業していたので、Windowsでのアップデート方法となります。
- node公式ページからインストーラーをダウンロード
- インストーラーを起動
- インストーラーに従って進めていき、再インストールする
インストーラーに従って画面ポチポチしていれば再インストールが完了するでしょう。オプションも特にないですし。
アップデート後の確認
インストール後、PowerShellでnode・npmの確認をする場合は以下のコマンドを実行してください。
nodeのバージョン
node -vnpmのバージョン
npm -vとそれぞれ実行してあげるとバージョンが確認できます。
調べ方・対策の仕方の流れ
とりあえず今回の問題の調べ方は、次のような感じです。
- エラーメッセージをGoogle検索
- ヒットしたstackoverflowのページを読む
- 今回のエラーと同じっぽいので対策を打つ
少し細かく
困ったときにはぐーぐる先生を頼るといいので、エラーメッセージをまずそのまま検索しました。すると、これまたみんな大好きstackoverflowがヒットするわけですね。
見つけたページ：Cannot find module ‘node:url’ when executing typescript from webstorm
タイトルを見る限り、「だいぶ近い事象じゃないか？」と思えたので、内容と回答を確認。で、一番スコアの高い回答を見ると・・・
The issue maybe is related to the node version.
The axios-cookiejar-support requires a specific node version (“node”: “>=14.18.0 <15.0.0 || >=16.0.0”).
https://stackoverflow.com/a/73407412
要は「nodeのバージョンに関連してるんじゃない？サポートバージョンは以下の範囲だよ」って回答ですね。
「・・・回答もドンピシャだな、きっと」と思って、解決策に書いたnodeのアップデートを実施して、再実行しました。
すると何事もなかったかのようにVue3のサンプルプロジェクトが動きましたとさ。めでたしめでたし。
さいごに
ライブラリやツール類のアップデートは定期的にやらないとダメですね。特にフロントエンド側で使われるライブラリは更新が早いイメージですし。。。
もしくは、仮想環境作ってプロジェクトごとにライブラリの管理をするのがいいでしょうね。正直、仮想環境使わずに色々試しているせいでマシン環境がだいぶ汚いのです。自戒も込めて。。
携わっているプロジェクトのチーム目標でも挙げているけど、自分個人のおもちゃ作りでもライブラリを新しく保つ、は掲げておかないとなぁ。
参考資料
コメント