Skip to content

Commit 0787eca

Browse files
authored
docs: Added eslint markdown plugin and fixed all critical errors (#414)
## Description Added eslint markdown plugin to format code blocks in docs using our eslint config. I corrected critical errors (mostly "...") so blocks are correctly formatted. It also generates a lot of new warnings (`no-unused-vars`) - we can safely ignore most of them, but when you produce new piece of docs you should monitor them, if they can be safely ignored, or did you misspell the variable you declared before that. We cannot enable `no-undef-vars` because it produces too many warnings (every JSX tag etc.), so we have to rely on those `no-unused-vars` warnings: <img width="999" alt="Screenshot 2025-06-23 at 12 56 40" src="https://github.com/user-attachments/assets/c2335831-b48d-433c-8077-5dfcb2b29c16" /> ### Type of change - [ ] Bug fix (non-breaking change which fixes an issue) - [ ] New feature (non-breaking change which adds functionality) - [ ] Breaking change (fix or feature that would cause existing functionality to not work as expected) - [x] Documentation update (improves or adds clarity to existing documentation) ### Related issues <!-- Link related issues here using #issue-number --> ### Checklist - [x] I have performed a self-review of my code - [ ] I have commented my code, particularly in hard-to-understand areas - [x] I have updated the documentation accordingly - [ ] My changes generate no new warnings - they do ### Additional notes <!-- Include any additional information, assumptions, or context that reviewers might need to understand this PR. -->
1 parent 0f71e38 commit 0787eca

17 files changed

Lines changed: 277 additions & 110 deletions

.cspell-wordlist.txt

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,3 +51,4 @@ MINILM
5151
MPNET
5252
QINT
5353
FNUZ
54+
wordlist

.eslintrc.js

Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,7 @@ module.exports = {
1212
'@react-native',
1313
'plugin:@cspell/recommended',
1414
'plugin:prettier/recommended',
15+
'plugin:markdown/recommended-legacy',
1516
],
1617
rules: {
1718
'react/react-in-jsx-scope': 'off',
@@ -33,6 +34,22 @@ module.exports = {
3334
],
3435
'camelcase': 'error',
3536
},
36-
plugins: ['prettier'],
37+
plugins: ['prettier', 'markdown'],
38+
overrides: [
39+
{
40+
files: ['**/*.md'],
41+
processor: 'markdown/markdown',
42+
},
43+
{
44+
files: ['**/*.md/*.{ts,tsx}'],
45+
rules: {
46+
'no-console': 'off',
47+
'react-hooks/rules-of-hooks': 'off',
48+
'react/jsx-no-undef': 'off',
49+
'@typescript-eslint/no-unused-vars': 'warn',
50+
'camelcase': 'warn',
51+
},
52+
},
53+
],
3754
ignorePatterns: ['node_modules/', 'lib/'],
3855
};

docs/docs/computer-vision/useClassification.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@ function App() {
6565
modulePath: EFFICIENTNET_V2_S,
6666
});
6767

68-
...
68+
// ...
6969
const imageUri = 'file:///Users/.../cute_puppy.png';
7070

7171
try {
@@ -79,7 +79,7 @@ function App() {
7979
} catch (error) {
8080
console.error(error);
8181
}
82-
...
82+
// ...
8383
}
8484
```
8585

docs/docs/computer-vision/useImageSegmentation.md

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -66,20 +66,20 @@ Setting `resize` to true will make `forward` slower.
6666
## Example
6767

6868
```typescript
69-
function App(){
70-
const model = useImageSegmentation(
69+
function App() {
70+
const model = useImageSegmentation({
7171
modelSource: DEEPLAB_V3_RESNET50,
72-
);
72+
});
7373

74-
...
74+
// ...
7575
const imageUri = 'file::///Users/.../cute_cat.png';
7676

77-
try{
78-
const outputDict = await model.forward(imageUri, [DeeplabLabel.CAT], true);
79-
}catch(error){
80-
console.error(error);
77+
try {
78+
const outputDict = await model.forward(imageUri, [DeeplabLabel.CAT], true);
79+
} catch (error) {
80+
console.error(error);
8181
}
82-
...
82+
// ...
8383
}
8484
```
8585

docs/docs/computer-vision/useOCR.md

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -10,13 +10,13 @@ It is recommended to use models provided by us, which are available at our [Hugg
1010

1111
## Reference
1212

13-
```jsx
13+
```tsx
1414
import {
1515
useOCR,
1616
DETECTOR_CRAFT_800,
1717
RECOGNIZER_EN_CRNN_512,
1818
RECOGNIZER_EN_CRNN_256,
19-
RECOGNIZER_EN_CRNN_128
19+
RECOGNIZER_EN_CRNN_128,
2020
} from 'react-native-executorch';
2121

2222
function App() {
@@ -25,18 +25,18 @@ function App() {
2525
recognizerSources: {
2626
recognizerLarge: RECOGNIZER_EN_CRNN_512,
2727
recognizerMedium: RECOGNIZER_EN_CRNN_256,
28-
recognizerSmall: RECOGNIZER_EN_CRNN_128
28+
recognizerSmall: RECOGNIZER_EN_CRNN_128,
2929
},
30-
language: "en",
30+
language: 'en',
3131
});
3232

33-
...
34-
for (const ocrDetection of await model.forward("https://url-to-image.jpg")) {
35-
console.log("Bounding box: ", ocrDetection.bbox);
36-
console.log("Bounding label: ", ocrDetection.text);
37-
console.log("Bounding score: ", ocrDetection.score);
33+
// ...
34+
for (const ocrDetection of await model.forward('https://url-to-image.jpg')) {
35+
console.log('Bounding box: ', ocrDetection.bbox);
36+
console.log('Bounding label: ', ocrDetection.text);
37+
console.log('Bounding score: ', ocrDetection.score);
3838
}
39-
...
39+
// ...
4040
}
4141
```
4242

docs/docs/computer-vision/useObjectDetection.md

Lines changed: 11 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -11,21 +11,24 @@ It is recommended to use models provided by us, which are available at our [Hugg
1111

1212
## Reference
1313

14-
```jsx
15-
import { useObjectDetection, SSDLITE_320_MOBILENET_V3_LARGE } from 'react-native-executorch';
14+
```tsx
15+
import {
16+
useObjectDetection,
17+
SSDLITE_320_MOBILENET_V3_LARGE,
18+
} from 'react-native-executorch';
1619

1720
function App() {
1821
const ssdlite = useObjectDetection({
1922
modelSource: SSDLITE_320_MOBILENET_V3_LARGE, // alternatively, you can use require(...)
2023
});
2124

22-
...
23-
for (const detection of await ssdlite.forward("https://url-to-image.jpg")) {
24-
console.log("Bounding box: ", detection.bbox);
25-
console.log("Bounding label: ", detection.label);
26-
console.log("Bounding score: ", detection.score);
25+
// ...
26+
for (const detection of await ssdlite.forward('https://url-to-image.jpg')) {
27+
console.log('Bounding box: ', detection.bbox);
28+
console.log('Bounding label: ', detection.label);
29+
console.log('Bounding score: ', detection.score);
2730
}
28-
...
31+
// ...
2932
}
3033
```
3134

docs/docs/computer-vision/useStyleTransfer.md

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -57,20 +57,20 @@ Images from external sources and the generated image are stored in your applicat
5757
## Example
5858

5959
```typescript
60-
function App(){
61-
const model = useStyleTransfer(
62-
modelSource: STYLE_TRANSFER_CANDY,
63-
);
60+
function App() {
61+
const model = useStyleTransfer({
62+
modelSource: STYLE_TRANSFER_CANDY,
63+
});
6464

65-
...
65+
// ...
6666
const imageUri = 'file::///Users/.../cute_cat.png';
6767

68-
try{
69-
const generatedImageUrl = await model.forward(imageUri)
70-
}catch(error){
71-
console.error(error)
68+
try {
69+
const generatedImageUrl = await model.forward(imageUri);
70+
} catch (error) {
71+
console.error(error);
7272
}
73-
...
73+
// ...
7474
}
7575
```
7676

docs/docs/computer-vision/useVerticalOCR.md

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ It is recommended to use models provided by us, which are available at our [Hugg
1414

1515
## Reference
1616

17-
```jsx
17+
```tsx
1818
import {
1919
DETECTOR_CRAFT_1280,
2020
DETECTOR_CRAFT_320,
@@ -37,13 +37,13 @@ function App() {
3737
independentCharacters: true,
3838
});
3939

40-
...
41-
for (const ocrDetection of await model.forward("https://url-to-image.jpg")) {
42-
console.log("Bounding box: ", ocrDetection.bbox);
43-
console.log("Bounding label: ", ocrDetection.text);
44-
console.log("Bounding score: ", ocrDetection.score);
40+
// ...
41+
for (const ocrDetection of await model.forward('https://url-to-image.jpg')) {
42+
console.log('Bounding box: ', ocrDetection.bbox);
43+
console.log('Bounding label: ', ocrDetection.text);
44+
console.log('Bounding score: ', ocrDetection.score);
4545
}
46-
...
46+
// ...
4747
}
4848
```
4949

docs/docs/fundamentals/loading-models.md

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,23 +7,29 @@ There are three different methods available for loading model files, depending o
77
**1. Load from React Native assets folder (For Files < 512MB)**
88

99
```typescript
10-
modelSource: require('../assets/llama3_2.pte');
10+
useExecutorchModule({
11+
modelSource: require('../assets/llama3_2.pte'),
12+
});
1113
```
1214

1315
**2. Load from remote URL:**
1416

1517
For files larger than 512MB or when you want to keep size of the app smaller, you can load the model from a remote URL (e.g. HuggingFace).
1618

1719
```typescript
18-
modelSource: 'https://.../llama3_2.pte';
20+
useExecutorchModule({
21+
modelSource: 'https://.../llama3_2.pte',
22+
});
1923
```
2024

2125
**3. Load from local file system:**
2226

2327
If you prefer to delegate the process of obtaining and loading model and tokenizer files to the user, you can use the following method:
2428

2529
```typescript
26-
modelSource: 'file::///var/mobile/.../llama3_2.pte',
30+
useExecutorchModule({
31+
modelSource: 'file::///var/mobile/.../llama3_2.pte',
32+
});
2733
```
2834

2935
:::info

0 commit comments

Comments
 (0)