はじめに
Nuxt.jsの学習を始めてみよう！と思ったところ、環境構築でエラーに遭遇したのでその対策をまとめてみました。
開発環境
- Apple M1
- Docker
- 20.10.8
- Docker Compose
- 1.29.2
- Node.js
- 16.13.0(LTS)
修正方法
まずは、パッケージの脆弱性がどうなっているかを
npm audit
で確認してみましょう。
1. glob-parent <5.1.2
「fix available ~」以降ですが、「npm audit fix --forceでこの脆弱性を修正することができますが、Nuxt.jsのバージョンが2.13.3になりますよ」と言っています。fixし、npm run devすると
2. DeprecationWarning: Use of deprecated folder mapping "./" ~
添付の内容を要約すると、「/src(Nuxt.jsが入るディレクトリ)/node_modules/@nuxt/components/package.jsonで非推奨のフォルダマッピング『./』が使われてます」となっており、「Update this package.json to use a subpath pattern like "./"」と言われているので、/src/node_modules/@nuxt/components/package.jsonの「./」を「./」へ修正します。
というエラーも出た場合は、同じ方法で修正してあげます。その後、npm run devすると
3. Module build failed (from ./node_modules/babel-loader/lib/index.js)
こちらに関しては、
https://stackoverflow.com/questions/66325582/nuxt-js-cannot-find-module-babel-preset-env-lib-utils を参考にさせていただきました。「@babel/preset-env updated, use old version 7.12.17」と書かれているため、
npm i @babel/preset-env@7.12.17
をします。その後、npm run devすると
4. These dependencies were not found
こちらに関しては、https://akizora.tech/npm-run-build-corejs-error-3208 を見ていただければと思います。
サイト内にある通り、
npm add core-js@2
します。その後、npm run devをしてみてください。おそらくビルド時のエラーはないと思われます。お疲れ様でした！！
さいごに
高い脆弱性をもつパッケージを修正し、エラーもなんとか解決することはできましたが、node_modules内のファイルを直接変更しているので、この方法がベストではないと思います。より良い方法をご存知でしたら、教えていただけると幸いです。