Skip to content

Commit 21d6bda

Browse files
authored
Update README.md (#14)
2 parents 5962ea8 + e2a592f commit 21d6bda

File tree

1 file changed

+39
-16
lines changed

1 file changed

+39
-16
lines changed

README.md

Lines changed: 39 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,9 @@
33
[![npm version](https://badge.fury.io/js/react-ai-translator.svg)](https://badge.fury.io/js/react-ai-translator)
44
[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](./LICENSE)
55

6-
A **React** component for **local, secure, on-demand translations** powered by the **[Xenova/nllb-200-distilled-600M](https://huggingface.co/Xenova/nllb-200-distilled-600M)** model. This package utilizes the **WebGPU** capabilities of the device on which the app runs, ensuring data privacy and enabling you to translate text without sending data to third-party APIs.
6+
1. This package provides a CLI command (**generate_translations**) to generate a `translations.json` file in your `public` directory, containing translations for your website's displayable content. It uses AI translation services (configurable via options) to translate your content into specified languages. The models used are downloaded from huggingface and run your in local env.
7+
8+
2. A **React** component for **local, secure, on-demand translations** powered by the **[Xenova/nllb-200-distilled-600M](https://huggingface.co/Xenova/nllb-200-distilled-600M)** model. This package utilizes the **WebGPU** capabilities of the device on which the app runs, ensuring data privacy and enabling you to translate text without sending data to third-party APIs.
79

810
> **Note**: This is especially suitable when security is a concern and parts of the data are user-provided, which might not be captured in your `i18n` translation files.
911
@@ -47,13 +49,46 @@ The example code used for this demo is available in this repository: **[joelshej
4749
Install the package via npm (or yarn):
4850

4951
```bash
50-
npm install react-ai-translator
51-
52+
npm i @codethicket/react-ai-translator
5253
```
5354

5455
# Usage
56+
## CLI Tool for Static Text Translation
57+
58+
We provide a simple CLI command to automatically collect and translate **all static text** in your application into desired languages. Run the following command from your project root:
59+
60+
```bash
61+
npx generate_translations -t Spanish Dutch
62+
63+
```
64+
This command collects all the static text in your app and translates it into the specified languages (Spanish and Dutch in this example).
65+
Other CLI options (for example, to exclude specific files or directories) can be found in the cli.js file.
66+
67+
``` npx generate_translations -t Spanish Danish ...``` run cli command in project workspace with a list of language options to generate translations.json file in public dir of your project .
68+
For full list of available options, including how to configure the translation model (e.g., specifying a Hugging Face model or API key) or selecting or excluding directories to parse, or available language options and more please refer to the cli.js file in the repository: https://github.com/joelshejar/ai-translation-demo.
69+
-t is the mandatory option to specify list of target languages.
70+
Options
71+
Here's a list of additional available options for the generate_translations command:
72+
73+
-t, --target_languages <target_languages...>: A list of target languages for translation. See the documentation in https://github.com/facebookresearch/flores/blob/main/flores200/README.md#languages-in-flores-200 for a list of supported languages and use the exact name in this list for this option eg: -t Spanish .
74+
75+
-d, --directory <directory>: The directory to start generating translations from. Defaults to the current working directory. Example: -d src.
76+
77+
-e, --extensions <extensions...>: File extensions to search for translatable text. Defaults to js, jsx, ts, and tsx. Example: -e js jsx html.
78+
79+
-i, --ignore_directories <ignore_directories...>: Directories to ignore during the search for translatable text. Defaults to node_modules, .git, .next, public, styles, and dist. Example: -i node_modules test .
5580

56-
Wrap your application (or a section of it) in the `TranslatorProvider` to initialize the translation model.
81+
-s, --source_language <source_language>: The source language to translate from. Defaults to English. Example: -s "en-US". See the documentation for a list of supported source languages.
82+
83+
-f, --ignore_files <ignore_files...>: Files to ignore during the search for translatable text. Defaults to .config. Example: -f config.js.
84+
85+
-m, --ignore_functions <ignore_functions...>: Function names to ignore when searching for translatable text (used to prevent translating code). Defaults to a list of common utility functions. Example: -m require cva.
86+
87+
-a, --ignore_attributes <ignore_attributes...>: HTML attributes to ignore when searching for translatable text. Defaults to a list of common attributes like href, src, etc. Example: -a className style.
88+
89+
-l, --model_name <model_name>: The specific Hugging Face model name to use for translation. Defaults to Xenova/nllb-200-distilled-600M. Other options include (but may not be limited to): Xenova/mbart-large-50-many-to-many-mmt, Xenova/m2m100_418M, and CXDuncan/madlad400-3b-mt-optimized-quantized-onnx. See the documentation for supported models and their language support.
90+
91+
2.Wrap your application (or a section of it) in the `TranslatorProvider` to initialize the translation model.
5792
Use the `useTranslator` hook or `Translator` component to translate text wherever needed.
5893

5994
Below is a minimal example. For more detailed usage, see the [Example](#example) section.
@@ -110,18 +145,6 @@ export default App
110145

111146
```
112147

113-
## CLI Tool for Static Text Translation
114-
115-
We provide a simple CLI command to automatically collect and translate **all static text** in your application into desired languages. Run the following command from your project root:
116-
117-
```bash
118-
npx generate_translations -t Spanish Dutch
119-
120-
```
121-
This command collects all the static text in your app and translates it into the specified languages (Spanish and Dutch in this example).
122-
Other CLI options (for example, to exclude specific files or directories) can be found in the cli.js file.
123-
124-
125148
# How It Works
126149

127150
- **Local Model**

0 commit comments

Comments
 (0)