i18n-chain 2.0 released, supporting TypeScript international components

update content

Breakings

• Data is no longer connected to the first-level chain, and needs to be obtained from the chain (this kind of direct use scenario is also less)

- const value = i18n.button.submit;
+ const value = i18n.chain.button.submit;

• Delete the underline _and adjust the built-in method back to the first level chain

- i18n ._. local ('zh'); 
+ i18n.local ('zh');

• Delete useI18n, change to get the chain from the instance

function App: FC = () => {
- useI18n(i18n);
+ const chain = i18n.use();

  return <div>{chain.button.submit}</div>; 
}

• Delete high-level components  I18nProviderand change to get hoc from instance

class App extends Component {
  render() {
+   const { chain } = this.props; 

-   return <div>{i18n.button.submit}</div>;
+   return <div>{chain.button.submit}</div>;
  }
}

-export default I18nProvider(i18n)(App);
+export default i18n.hoc(App);

Features

• New methods translate, tconsistent with those, are used to translate string templates
• New string template generation tool

// It is the same as writing a string directly, but here is a prompt 
const key = i18n. literal . Button . Submit ; // key ==='button.submit' 

// You can use the translate method to get the real data 
const value = i18n. translate (key);   // value ==='Submit'

------------------------------------

Introduction

Speaking of internationalization, have you been in the duplication of copy and paste all year round? t('home:submit') t('common:something:success') There are no hints like  these, you need to remember, not only the development efficiency is low, but the keyboard is easy to type the wrong letters faster. The point is that you can hardly find this kind of error.

I prefer code with hints. Using it typescript, I invented an i18n component that uses chained operations and has all the hints. Just like  i18n.common.something.success this, the code can be automatically completed to ensure that there is no mistake.

compatibility

IE	Edge	Chrome	Firefox	Safari	Node
9+	12+	5+	4+	5+	*