typescript-react-intl
Extracts string messages from TypeScript React components or ts files that use React Intl. You can use it in React Native too.
Usage
If you have many files to processes,you can get contents use node-glob with fs module Custom component support since version
0.3.0. checkout tests/index.js
npm i typescript-react-intl -Dvar parse = require("typescript-react-intl").default;
// results is an array
// contents is your tsx file
var results = parse(contents);
// or if you want support custom components
var results = parse(contents, {
tagNames: ["MyComponent", "StyledText"],
});React-intl
Only support <FormattedMessage/> and defineMessages We don't use <FormattedHtmlMessage/>
Examples
var fs = require("fs");
var glob = require("glob");
var parser = require("typescript-react-intl").default;
function runner(pattern, cb) {
var results = [];
pattern = pattern || "src/**/*.@(tsx|ts)";
glob(pattern, function(err, files) {
if (err) {
throw new Error(err);
}
files.forEach((f) => {
var contents = fs.readFileSync(f).toString();
var res = parser(contents);
results = results.concat(res);
});
cb && cb(results);
});
}
// demo
runner(null, function(res) {
var locale = {};
res.forEach((r) => {
locale[r.id] = r.defaultMessage;
});
var locales = {
en: locale,
};
// save file to disk。you can save as a json file,just change the ext and contents as you want.
fs.writeFileSync(
`src/translations/all.ts`,
`export default ${JSON.stringify(locales, null, 2)}\r`,
);
});