Type-Safe i18n on RN

Type-Safe i18n on RN

Ce37cf75fa85b89a33916545978c64de?s=128

@hotchemi

June 22, 2018
Tweet

Transcript

  1. Type-Safe i18n on RN Quipper Limited @hotchemi

  2. 7/19 Thu 19:30~22:00

  3. react-native-i18n user?!

  4. • It’s OK, but... • key name can be long

    and nested • gotta move around definition and code • can’t detect an error in compile time • “missing [key name] translation”
  5. None
  6. • quipper/react-native-i18n-ts • paired with TypeScript • inspired by R.java

    mechanism • strong IDE support • compile time check
  7. Demo

  8. • Under the hood • Generate d.ts file from definition

    • with TypeScript compiler API
  9. declare module "react-native-i18n" { var fallbacks: boolean; var translations: {

    [keys: string]: any; }; function t(key: "common.cancel", opts: { value: any; }): string; function t(key: "common.ok"): string; } // for json loading declare module "*.json" { const value: any; export default value; }
  10. • Installation • yarn add -D react-native-i18n-ts • set “model”

    and “outputDir” in package.json • tweak filesGlob in tsconfig.json • execute “yarn i18n-ts” command
  11. Enjoy!