esbuildで公式の大事さを認識したので共有します。
APIの新しい使い方として、React Queryがアツいと聞いたので、インストールしようと思ったら、自分ではどうしようもないエラーに遭遇したので、自戒と公式の重要性も兼ねて記事にします。
結論
自分では解決できない問題でした。公式が対応するのを待つ必要がありました。
問題に遭遇した経緯
React Queryを使おうと思って、以下のコマンドを叩いのが全てのはじまり
$ npm install @tanstack/react-query
そうするとこんなエラーがでました↓
removed 2 packages, changed 2 packages, and audited 402 packages in 2s
72 packages are looking for funding
run `npm fund` for details
2 moderate severity vulnerabilities
To address all issues (including breaking changes), run:
npm audit fix --force
Run `npm audit` for details.
試したこと(ダメだったこと)
1.npm audit fixを使う
$ npm audit fix
変わらず同じエラーが....
2.npm auditを叩いて原因究明
$ npm audit
すると....
# npm audit report
esbuild <=0.24.2
Severity: moderate
esbuild enables any website to send any requests to the development server and read the response - https://github.com/advisories/GHSA-67mh-4wv8-2f99
fix available via `npm audit fix --force`
Will install esbuild@0.25.0, which is a breaking change
node_modules/esbuild
vite >=0.11.0
Depends on vulnerable versions of esbuild
node_modules/vite
2 moderate severity vulnerabilities
To address all issues (including breaking changes), run:
npm audit fix --force
「ふむふむ、どうやらesbuildが悪さをしているようだ。んじゃ、esbuild0.25.0をインストールしてみっか」
と以下のコマンドを叩くと...
$ npm install esbuild@0.25.0
また、同じエラーが....
removed 2 packages, changed 2 packages, and audited 402 packages in 2s
72 packages are looking for funding
run `npm fund` for details
2 moderate severity vulnerabilities
To address all issues (including breaking changes), run:
npm audit fix --force
Run `npm audit` for details.
3.node_modulesをクリーンリンストールする
仕方がないので、ライブラリを入れ直すことに....
$ rm -rf node_modules package-lock.json && npm install
すると....
emoved 2 packages, changed 2 packages, and audited 402 packages in 2s
72 packages are looking for funding
run `npm fund` for details
2 moderate severity vulnerabilities
To address all issues (including breaking changes), run:
npm audit fix --force
Run `npm audit` for details.
どうじて......
原因.....
原因は、viteにありました...。
package-lock.json
改めて、npm auditの内容をみるとviteが絡んでいたそうで、とりあえずviteのpackage-lock.jsonを見てみました。
package-lock.json
"node_modules/vite": {
"version": "6.1.0",
"resolved": "https://registry.npmjs.org/vite/-/vite-6.1.0.tgz",
"integrity": "sha512-RjjMipCKVoR4hVfPY6GQTgveinjNuyLw+qruksLDvA5ktI1150VmcMBKmQaEWJhg/j6Uaf6dNCNA0AfdzUb/hQ==",
"dev": true,
"license": "MIT",
"dependencies": {
"esbuild": "^0.24.2",
"postcss": "^8.5.1",
"rollup": "^4.30.1"
},
これをみて鋭い方はお気付きでしょう。そうViteはセキュリティパッチが当たる前のesbuildしか対応していないのです。
Viteの公式Githubではissuesが立てられてました。
というように、viteが対応するのを「待て」ということでした。
これは他のブログなどには書かれていなかったため、やっぱり公式を確認するのは重要だよね、と再確認させられるものでした。