前回から引き続き、.envファイルの話です。

client.jsファイルが毎回エラーとなっており、なんでなのかChatGPTさんにずっと相談していました。

結論

ちゃんと記号は細部まで見よう！！！！

エラーファイルと比較

//このファイルは問題ないです。が、エラー表示にはcreateClientがおかしいよ！と出ていました。

import { createClient } from 'microcms-js-sdk';

export const client = createClient({
	serviceDomain: process.env.SERVICE_DOMAIN, //各々のドメイン
	apiKey: process.env.API_KEY,　//.env.*ファイルを参照してねという指令
});

localhost:3000ではずっとこの[createClientがおかしいよ！]って言われていました。

.envはこれ

SERVICE_DOMAIN: '各々のドメイン',
API_KEY:'各々のAPI_KEY'

よく見るとこれ、コロンじゃなくて「＝」じゃない？

ついでにChatGPTさんに言われた通り、コンマもクォーテーションもなしにしました。

SERVICE_DOMAIN=your-service-domain
API_KEY=your-api-key

表示された！！！！！
もしうまくいかない方がいたら、余計な「’ ‘」や「,」がないか、チェックしてみてください。

結構な時間を費やしてこんなことだったのかい・・・(3日以上とけました）

でもenvファイルを使ってAPIキーを保護しつつ、APIを利用できるようになりました。
やったぜ！！！

関連記事

microCMSのAPIに手こずった話 microCMSのAPIに手こずった話[2] vercelにNext.jsを認識してもらえない lottieを使ってみる