グロメットスターターのhot-update.jsでエラーが発生しました

Question

Grommet の開始サンプルに取り組んでいたところ、 タグを追加するときに次のエラーが発生しました:

defaultValidatorFn は関数ではありません
TypeError:defaultValidatorFn は関数ではありません
    shouldForwardProp で (http://localhost:3000/main.c6cdacb143c3e873b1fb.hot-update.js:4491:12)
    http://localhost:3000/main.c6cdacb143c3e873b1fb.hot-update.js:11014:142 で
    D (http://localhost:3000/main.c6cdacb143c3e873b1fb.hot-update.js:11023:6)
    renderWithHooks (http://localhost:3000/static/js/bundle.js:31049:22) で
    updateForwardRef で (http://localhost:3000/static/js/bundle.js:33620:24)
    beginWork で (http://localhost:3000/static/js/bundle.js:35667:20)
    HTMLUnknownElement.callCallback (http://localhost:3000/static/js/bundle.js:20641:18) で
    Object.invokeGuardedCallbackDev (http://localhost:3000/static/js/bundle.js:20685:20) で
    invokeGuardedCallback (http://localhost:3000/static/js/bundle.js:20742:35) で
    beginWork$1 (http://localhost:3000/static/js/bundle.js:40616:11)

で

さらに詳しく調べると、以下に示すように、コンソールに一連の警告が表示されます。

styled-components: 不明なプロップ「フル」が DOM に送信されているようです。これにより、React コンソール エラーがトリガーされる可能性があります

;

yarn add @emotion/is-prop-validを試してみましたが、違いはありませんでした。ここで私は何を間違っているのでしょうか？

Answer 1

手順の 1 つは、styled-components を依存関係に追加することです。最新のメジャー バージョンは 6 ですが、Grommet は現在 5 とのみ互換性があります。 package.json のバージョンを ^5.3.11 に変更したところ、問題は解決しました。