プログラミング React Hydration Failed がブラウザ拡張 (extension) による script/tag の挿入で起きるケース
React SSR 環境で Hydration Failed が発生？実はブラウザ拡張が <head> や <body> にタグを挿入している可能性があります。原因特定の方法、suppressHydrationWarning の適切な使い方、クライアント専用レンダーでの回避策を解説。
プログラミング
プログラミング 
プログラミング Nuxt + Docker 環境で runtimeConfig の public env がクライアント遷移後に消える問題とその対処
Docker やコンテナ環境で Nuxt アプリをデプロイすると、初回表示では正常に runtimeConfig.public の値が取得できるのに、クライアントサイドのページ遷移後に値が消える／undefined になる という問題に遭遇...
プログラミング Nuxt 3 で runtimeConfig が undefined に？環境変数・バージョン依存の読み込み失敗の対処法
Nuxt 3 を使った開発で、useRuntimeConfig() を呼び出したら undefined が返ってきてしまった……という現象に遭遇することがあります。とくに 3.13.0 などの一部バージョンや、Docker / クラウド環境...
プログラミング React の useId() を条件レンダー + ループで使うと Hydration Mismatch が起きる原因と対策
React 18 以降では、フォーム要素やアクセシビリティ対応のために useId() というフックが導入されました。これにより、サーバーサイドレンダリング (SSR) とクライアントで同一の一意な ID を生成できます。しかし、条件付きレ...
プログラミング Bashで「bad substitution」エラーが出る原因と対処法
シェルスクリプトを書いていると、次のようなエラーに遭遇することがあります。./script.sh: line 10: ${VAR//foo/bar}: bad substitution一見すると単純な文法ミスのように見えますが、これは シェ...
プログラミング Gitで「fatal: ref HEAD is not a symbolic ref」エラーが出たときの解決策
Git を使って開発をしていると、初回コミットや空のリポジトリに対して操作を行ったときに次のようなエラーが出ることがあります。fatal: ref HEAD is not a symbolic ref初めて見ると驚くメッセージですが、これは...
プログラミング Dockerで「exec user process caused: exec format error」エラーが出る原因と対処法
Docker を使って開発していると、ビルドしたコンテナを実行した際に次のようなエラーが表示されることがあります。standard_init_linux.go:228: exec user process caused: exec form...
プログラミング Jestで「ReferenceError: fetch is not defined」エラーが出る原因と対処法
Jest を使ってテストを書いていると、次のようなエラーに遭遇することがあります。ReferenceError: fetch is not definedこれは、Node.js 環境で実行される Jest が ブラウザの fetch API...
プログラミング Node.jsで「ERR_REQUIRE_ESM」エラーが出たときの解決策
Node.js プロジェクトを開発していると、次のようなエラーメッセージに遭遇することがあります。Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: /path/to/mo...
プログラミング TypeScriptで「Property ‘x’ does not exist on type ‘never’」エラーが出る原因と解決法
TypeScript を使って開発しているときに、次のようなエラーに出くわしたことはありませんか？Property 'name' does not exist on type 'never'.このエラーは、TypeScript の型推論が「...