自分が作ったサイトのブログにコメント機能を付ける。
タイトルにあるように、ブログはSupabaseは無関係です。
コメント機能を見始めたが、ブログ本体の理解が必要と感じ、
「Next.js13新機能のAppDirectoryとSupabaseでブログ構築」を始めたが途中でエラーが出た。
「11 状態管理Zustand」にあるように実行したら、utils\supabase-server.tsの7行目で
supabase_auth_helpers_nextjs__WEBPACK_IMPORTED_MODULE_1_.createServerComponentSupabaseClient) is not a function
のエラーで直し方が分かりません
多分、ほどんどコピペしているので、記事の通りと思います。
ソースをD/Lして該当部分を比較しましたが同じでした。
「04 Next.js準備」に「もし最新のバージョンで動かない場合は、下記のバージョンに合わせてください。」とありますが、
勝手に変えていいのでしょうか
私の環境は、Windows10Proでコンパイルは、WindowsPowerSellで行っています。pachage.jsonは
"dependencies": {
"@supabase/auth-helpers-nextjs": "^0.7.4",
"@supabase/supabase-js": "^2.32.0",
"@types/node": "20.4.9",
"@types/react": "18.2.20",
"@types/react-dom": "18.2.7",
"@types/uuid": "^9.0.2",
"autoprefixer": "10.4.14",
"date-fns": "^2.30.0",
"eslint": "8.46.0",
"eslint-config-next": "13.4.13",
"next": "13.4.13",
"postcss": "8.4.27",
"react": "18.2.0",
"react-dom": "18.2.0",
"server-only": "^0.0.1",
"sharp": "^0.32.4",
"supabase": "^1.83.7",
"tailwindcss": "3.3.3",
"typescript": "5.1.6",
"uuid": "^9.0.0",
"zustand": "^4.4.1"
},
"devDependencies": {
"encoding": "^0.1.13"
}
です。ほかに、必要なことがあるでしょうか。
ご質問ありがとうございます。
インストールされているバージョンが、チュートリアルのバージョンと異なるため発生しているエラーかと思います。
特にsupabase関連のバージョンが上がっているので、書き方が異なってきます。
バージョンをチュートリアルのバージョンに合わせて実装してみて、
全体が把握できてから、最新のバージョンにしてsupabaseのドキュメントを見ながら実装していくことをオススメします。
■チュートリアルのバージョン
"@supabase/auth-helpers-nextjs": "^0.5.4",
"@supabase/supabase-js": "^2.4.1",
"supabase": "^1.34.5",
↓
"@supabase/auth-helpers-nextjs": "^0.7.4",
"@supabase/supabase-js": "^2.32.0",
"supabase": "^1.83.7",
早速の回答、ありがとうございます。
なにせ、当方は初心者ゆえ、バージョンの変更方法が分かりません。ネットで「Supabaseバージョンの変更方法」 を
検索しましたが、分かりませんでした。
逸脱した質問かもしれません。ご存知でしたらご教授お願いします。
rm -rf node_modules
でnode_modulesフォルダを削除します。
package.json
の中身を削除して、チュートリアルのpackage.json
の中身に置き換えます。
npm i
でライブラリをインストールします。
これで、チュートリアルのバージョンと同じになります。
試してみてください。