Next.js13でreact-bootstrapが使えない

Question

「App Directory」を有効にしたNext.js13で「bootstrap」と「react-bootstrap」を導入して読み込もうとすると以下のようなエラーが出ます。Next.js12の頃は出ませんでした。
もし解決できた方いらっしゃいましたらご教示頂きたく。

追加時

yarn add bootstrap@next react-bootstrap

エラー内容

Server Error
TypeError: createContext only works in Client Components. Add the "use client" directive at the top of the file to use it. Read more: https://nextjs.org/docs/messages/context-in-server-component

Answer 1

先頭に「"use client";」が必要でした。クライアント側でレンダリングさせるための指示のようです。

"use client";
import 'bootstrap/dist/css/bootstrap.min.css'