https://github.com/bang88/typescript-react-intl

Extracts string messages from TypeScript React components or ts files that use React Intl.
https://github.com/bang88/typescript-react-intl

typescript-react-components

Last synced: 9 months ago
JSON representation

Extracts string messages from TypeScript React components or ts files that use React Intl.

• Host: GitHub
• URL: https://github.com/bang88/typescript-react-intl
• Owner: BANG88
• License: mit
• Created: 2016-12-01T12:16:52.000Z (about 9 years ago)
• Default Branch: master
• Last Pushed: 2019-12-16T09:49:24.000Z (about 6 years ago)
• Last Synced: 2025-04-30T12:15:15.655Z (9 months ago)
• Topics: typescript-react-components
• Language: TypeScript
• Size: 156 KB
• Stars: 53
• Watchers: 3
• Forks: 12
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# 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. 

[![Build Status](https://travis-ci.org/bang88/typescript-react-intl.svg?branch=master)](https://travis-ci.org/bang88/typescript-react-intl)

## 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

```sh

npm i typescript-react-intl -D

```

```js

var 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 `` and `defineMessages` We don't use ``

### Examples

```js

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`,

  );

});

```