Amplify UIのログイン画面
Amplify UIを使えば画像のようなログイン画面が簡単につくれます。
この画面の作り方は公式にも、いろんなサイトにも載っているので今回は割愛します。
公式はこちら
Amplify UIを日本語にしようとしたら一部だけ英語のまま
このUIに対して、I18nというモジュールを使えば日本語化することができます。
しかし、ユーザー名のプレースホルダだけ「Enter your Username」で英語のままになります。
原因
英語と日本語のマッピングファイルは下記に置いてあり、日本語化するときにこのファイルを使っています。
しかし、「Enter your Username」とすべきところを「Enter your username」としてしまっており、参照できずに英語のままになってます。(usernameの"u"が小文字になってます)
これについては既に見つけている方がおり、プルリクを出していました。
対処法
プルリクが出されているのでいずれ修正されると思いますが、対応方法としてはモジュールの中身のマッピングファイルを直接直すか、下記の記述を追加することで回避できます。
I18n.putVocabularies(translations);
I18n.setLanguage('ja');
// 下記を追加
I18n.putVocabularies({
ja: {
'Enter your Username': 'ユーザー名を入力',
},
});