Next.js

AWS AmplifyでNode.js v18を使うと「GLIBC not found」が発生する

最近新たに開始したプロジェクトで、開発環境をNode.js v18 + Next.js v13に更新した。検証のためにAWS Amplifyにデプロイしたがエラーが発生。 ちょっと調べるとあるあるらしいので、何番煎じかわからないが対応方法をメモ。 環境 Node.js v18.16.1, Next.j…

Storybookにアイコンでのロケール変更機能を追加する

React + Next.js で、多言語対応したアプリケーションを開発している。 日本語から、英語などのラテン文字で記述する言語に切り替えた場合、文字が長くなり、レイアウトが崩れることがあるため、各言語でのレイアウトを簡潔に確認したい。 アプリケーション…

create next appした時のグローバルなCSSファイル、exampleによってglobals.cssだったりglobal.cssだったりする

小ネタ。 yarn create next-app したプロジェクトの設定ファイルなどを、 yarn create next-app --example with-jest したプロジェクトにコピーし、 yarn build したら Module not found: Can't resolve 'styles/globals.css' が発生。 TypeScriptプロジェク…

Next.js + TypeScript + AWS AmplifyのプロジェクトでJest実行時に「SyntaxError: Unexpected token 'export'」が発生する

Next.js と AWS Amplify を使ったプロジェクトで、TypeScriptのファイルに対してJestのテストを書いたら、 SyntaxError: Unexpected token 'export' エラーが発生。 このエラー自体はよくあるやつだが、設定を大きくいじらず解決する方法を調べるのに結構時…

Next.jsプロジェクトでTypeScriptのimportの並び順を指定する

JavaやKotlinを長く書いてきて、importの並び順、ソートはフォーマッターにお任せだった。 Next.jsをTypeScriptで書いているプロジェクトでも、Javaと同様、importの順序を統一したいと思い、設定したのでメモ。 環境 ESLintプラグインの導入 .eslintrc の記…