以前ハマったところ、解決策1(core-jsのバージョンを落とす)で対応したのですが、babelの設定を変更することで解決できることがわかったのでメモ。
NuxtのプロジェクトにFirebaseを組み込むとき、buildのタイミングでcore-js関連のエラーが吐き出されます。
create-nuxt-app hogehoge
yarn add firebase
yarn dev
↓ すると...依存性が見つからない旨のエラーが出力されます。
(抜粋)
ERROR Failed to compile with 39 errors
These dependencies were not found:
* core-js/modules/es6.array.find in ./.nuxt/client.js
* core-js/modules/es6.array.from in ./.nuxt/utils.js, ./.nuxt/components/nuxt-link.client.js
* core-js/modules/es6.array.iterator in ./.nuxt/client.js
* core-js/modules/es6.date.to-string in ./.nuxt/utils.js, ./.nuxt/components/nuxt.js
解決するために
To install them, you can run: npm install --save core-js/modules/es6.array.find 〜〜
を実行しろとありますが、これらのパッケージは存在しません。
解決策
その1 core-jsのバージョンを2系にする
firebaseが参照しているcore-jsがおそらく2系なのか、Nuxtとの噛み合わせが悪いようでした。
そこでcore-jsをダウングレードします。
yarn add core-js@2.6.11
これでも解決するのですが、core-jsのメジャーバージョンを落とすのはいささかイマイチな気がしていました。
その2 babelの設定を変更する
nuxt.config.js(ts)の、buildプロパティを変更します。
export default {
mode: 'universal',
// (中略)
build: {
babel: {
presets({ isServer }: any) {
return [
[
require.resolve('@nuxt/babel-preset-app'),
{
buildTerget: isServer ? 'server' : 'client',
corejs: { version: 3 },
},
],
]
},
},
},
}
}
nuxt.config.js(ts)でcorejsの設定を加えることで解決できました!!
余談
(Qiita) core-jsがメンテされていない理由→プロジェクトは継続する
大丈夫なんでしょうか^^;