ast-i18n
v1.0.1
Published
The objective of this tool is to make easy to migrate an existing codebase to use i18n
Downloads
11
Readme
AST i18n
The objective of this tool is to make easy to migrate an existing codebase to use i18n
How it works
- it gets a list of files from the command line
- it runs a babel plugin transform to find all string inside JSXText
- it generates a stable key for the extracted strings
- it generates i18n files format based on this map
- it modify your existing code to use i18n library of your preference
Example
Before this transform
import React from 'react';
const Simple = () => (
<span>My simple text</span>
);
After this transform
import React from 'react';
import { withTranslation } from 'react-i18next'
const Simple = ({ t }) => (
<span>{t('my_simple_text')}</span>
);
Usage of string extractor
yarn start --src=myapp/src
- It will generate a resource.jsx file, like the below:
export default {
translation: {
'ok': `ok`,
'cancelar': `cancelar`,
'continuar': `continuar`,
'salvar': `salvar`,
'endereco': `endereço:`,
'troca_de_senha': `troca de senha`,
'dados_pessoais': `dados pessoais`,
[key]: 'value',
}
}
How to use resource with react-i18next?
- rename resource.tsx to your main language, like en.ts
- create other resource languages based on the generated one
import en from './en';
i18n.use(LanguageDetector).init({
resources: {
en,
},
fallbackLng: 'ptBR',
debug: false,
interpolation: {
escapeValue: false, // not needed for react!!
formatSeparator: ',',
},
react: {
wait: true,
},
});
Usage of i18n codemod
npm i -g jscodeshift
jscodeshift -t src/i18nTransfomerCodemod.ts PATH_TO_FILES
How to customize blacklist
Use ast.config.js to customize blacklist for jsx attribute name and call expression calle
module.exports = {
blackListJsxAttributeName: [
'type',
'id',
'name',
'children',
'labelKey',
'valueKey',
'labelValue',
'className',
'color',
'key',
'size',
'charSet',
'content',
],
blackListCallExpressionCalle: [
't',
'_interopRequireDefault',
'require',
'routeTo',
'format',
'importScripts',
'buildPath',
'createLoadable',
'import',
'setFieldValue',
],
};