今天偶然发现 next国际化项目中 出现了这样的字样
这其实是语言包的一部分。
不过我觉得有点奇怪 因为当前页面并没有用到需要客户端翻译的部分 甚至连useTranslations都没有
经过检查 我发现是@/app/[locale]/layout.tsx 里 NextIntlClientProvider导致的 这是一个ServerContext 可以为客户端组件、服务端组件提供plain-object类型的context上下文 它可以接受参数messages 客户端组件的useTranslations会将它提供的messages作为语言包 并寻找相应的翻译
在不传messages的时候 实际上等同于把当前语言的所有语言包都传到子组件,而且传递的方式并不是按需 而是粗暴的嵌入在html中 如果语言包较大 就会造成很大的空间浪费
因此 在使用next-intl时 应当在保证语义清晰、代码简洁的情况下,做到以下几点:
-
尽量在服务端使用翻译能力而不是客户端。即,多写服务端组件。
-
传递合适的messages,而不是全部的语言包。传undefined或null是不可接受的,这等同于传递全部的语言包。如果想传递空的语言包,将参数赋值为{}即可。
-
合理设置语言包结构,使得挑选其中的少量对象即可满足需求。