Skip to content
This repository was archived by the owner on May 4, 2020. It is now read-only.

Commit fe50119

Browse files
committed
chore: consolidate docs
1 parent fb1af43 commit fe50119

File tree

21 files changed

+331
-1609
lines changed

21 files changed

+331
-1609
lines changed
Lines changed: 1 addition & 85 deletions
Original file line numberDiff line numberDiff line change
@@ -1,87 +1,3 @@
11
# babel-plugin-react-intl
22

3-
Extracts string messages for translation from modules that use [React Intl][].
4-
5-
## Dependencies
6-
7-
### React Intl
8-
9-
This Babel plugin works with React Intl v2.x
10-
11-
### Babel
12-
13-
- **3.x** of this plugin works with Babel 7
14-
- **2.x** works with Babel 6
15-
- **1.x** works with Babel 5
16-
17-
## Installation
18-
19-
```sh
20-
$ npm install babel-plugin-react-intl
21-
```
22-
23-
## Usage
24-
25-
**This Babel plugin only visits ES6 modules which `import` React Intl.**
26-
27-
The default message descriptors for the app's default language will be extracted from: `defineMessages()`, `defineMessage()`, and `<FormattedMessage>`; all of which are named exports of the React Intl package.
28-
29-
If a message descriptor has a `description`, it'll be removed from the source after it's extracted to save bytes since it isn't used at runtime.
30-
31-
### Via `.babelrc` (Recommended)
32-
33-
**.babelrc**
34-
35-
```json
36-
{
37-
"plugins": [
38-
[
39-
"react-intl",
40-
{
41-
"messagesDir": "./build/messages/"
42-
}
43-
]
44-
]
45-
}
46-
```
47-
48-
### Options
49-
50-
- **`messagesDir`**: The target location where the plugin will output a `.json` file corresponding to each component from which React Intl messages were extracted. If not provided, the extracted message descriptors will only be accessible via Babel's API.
51-
52-
- **`extractSourceLocation`**: Whether the metadata about the location of the message in the source file should be extracted. If `true`, then `file`, `start`, and `end` fields will exist for each extracted message descriptors. Defaults to `false`.
53-
54-
- **`moduleSourceName`**: The ES6 module source name of the React Intl package. Defaults to: `"react-intl"`, but can be changed to another name/path to React Intl.
55-
56-
- **`overrideIdFn`**: A function with the signature `(id: string, defaultMessage: string, description: string|object) => string` which allows you to override the ID both in the extracted javascript and messages.
57-
58-
- **`removeDefaultMessage`**: Remove `defaultMessage` field in generated js after extraction.
59-
60-
- **`additionalComponentNames`**: Additional component names to extract messages from, e.g: `['FormattedFooBarMessage']`. **NOTE**: By default we check for the fact that `FormattedMessage` are imported from `moduleSourceName` to make sure variable alias works. This option does not do that so it's less safe.
61-
62-
- **`extractFromFormatMessageCall`**: Opt-in to extract from `intl.formatMessage` call with the same restrictions, e.g: has to be called with object literal such as `intl.formatMessage({ id: 'foo', defaultMessage: 'bar', description: 'baz'})`
63-
64-
- **`outputEmptyJson`**: output file with empty `[]` if src has no messages. For build systems like bazel that relies on specific output mapping, not writing out a file can cause issues.
65-
66-
- **`pragma`**: parse specific additional custom pragma. This allows you to tag certain file with metadata such as `project`. For example with this file:
67-
68-
```tsx
69-
// @intl-meta project:my-custom-project
70-
import {FormattedMessage} from 'react-intl';
71-
72-
<FormattedMessage defaultMessage="foo" id="bar" />;
73-
```
74-
75-
and with option `{pragma: "@intl-meta"}`, we'll parse out `// @intl-meta project:my-custom-project` into `{project: 'my-custom-project'}` in the result file.
76-
77-
### Via Node API
78-
79-
The extract message descriptors are available via the `metadata` property on the object returned from Babel's `transform()` API:
80-
81-
```javascript
82-
require('@babel/core').transform('code', {
83-
plugins: ['react-intl'],
84-
}); // => { code, map, ast, metadata['react-intl'].messages, metadata['react-intl'].meta };
85-
```
86-
87-
[react intl]: https://github.com/formatjs/react-intl
3+
We've migrated the README to [here](../../website/docs/tooling/babel-plugin.md).

packages/cli/README.md

Lines changed: 2 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,46 +1,3 @@
1-
# `formatjs-cli`
1+
# @formatjs/cli
22

3-
This CLI allows you to extract `intl-messageformat` messages from JavaScript / TypeScript source code,
4-
including React components that uses `react-intl`.
5-
6-
## Usage
7-
8-
````shell
9-
$ npm -g i @formatjs/cli
10-
$ formatjs extract --help
11-
Usage: formatjs extract [options] [files...]
12-
Usage: formatjs extract [options] [files...]
13-
14-
Extract string messages from React components that use react-intl.
15-
The input language is expected to be TypeScript or ES2017 with JSX.
16-
17-
Options:
18-
--messages-dir <dir> The target location where the plugin will output a `.json` file corresponding to each component from which React Intl messages were extracted. If not provided, the extracted message
19-
descriptors will be printed to standard output.
20-
--out-file <path> The target file path where the plugin will output an aggregated `.json` file of allthe translations from the `files` supplied.
21-
This flag will ignore --messages-dir
22-
--id-interpolation-pattern <pattern> If certain message descriptors don't have id, this `pattern` will be used to automaticallygenerate IDs for them. Default to `[contenthash:5]`.
23-
See https://github.com/webpack/loader-utils#interpolatename for sample patterns
24-
--extract-source-location Whether the metadata about the location of the message in the source file should be extracted. If `true`, then `file`, `start`, and `end` fields will exist for each extracted
25-
message descriptors. (default: false)
26-
--module-source-name <name> The ES6 module source name of the React Intl package. Defaults to: `"react-intl"`, but can be changed to another name/path to React Intl.
27-
--remove-default-message Remove `defaultMessage` field in generated js after extraction (default: false)
28-
--additional-component-names <comma-separated-names> Additional component names to extract messages from, e.g: `['FormattedFooBarMessage']`. **NOTE**: By default we check for the fact that `FormattedMessage` is imported from
29-
`moduleSourceName` to make sure variable alias works. This option does not do that so it's less safe.
30-
--extract-from-format-message-call Opt-in to extract from `intl.formatMessage` call with the same restrictions, e.g: has to be called with object literal such as `intl.formatMessage({ id: 'foo', defaultMessage:
31-
'bar', description: 'baz'})` (default: false)
32-
--output-empty-json Output file with empty [] if src has no messages. For build systems like bazel that relies on specific output mapping, not writing out a file can cause issues. (default: false)
33-
--ignore <files> List of glob paths to **not** extract translations from.
34-
--throws Whether to throw an exception when we fail to process any file in the batch.
35-
--pragma <pragma> parse specific additional custom pragma. This allows you to tag certain file with metadata such as `project`. For example with this file:
36-
37-
```
38-
// @intl-meta project:my-custom-project
39-
import {FormattedMessage} from 'react-intl';
40-
41-
<FormattedMessage defaultMessage="foo" id="bar" />;
42-
```
43-
44-
and with option `{pragma: "@intl-meta"}`, we'll parse out `// @intl-meta project:my-custom-project` into `{project: 'my-custom-project'}` in the result file.
45-
-h, --help display help for command
46-
````
3+
We've migrated the README to [here](../../website/docs/tooling/cli.md).

0 commit comments

Comments
 (0)