Skip to content

Commit 4a95c76

Browse files
authored
docs(devs-infra): update documentation for react-native (#2754)
1 parent b4f698f commit 4a95c76

3 files changed

Lines changed: 60 additions & 31 deletions

File tree

website/docs/guides/react-native.md

Lines changed: 20 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,20 @@ module.exports = {
1818
}
1919
```
2020

21+
### TypeScript Configuration
22+
23+
Create a new `tsconfig.spec.json` at the root of your project with the following content
24+
25+
```json
26+
// tsconfig.spec.json
27+
{
28+
"extends": "./tsconfig.json",
29+
"compilerOptions": {
30+
"jsx": "react"
31+
}
32+
}
33+
```
34+
2135
### Jest config
2236

2337
In the same way that you moved Babel config, move Jest config from `jest` key of `package.json` to `jest.config.js`. It should look like this:
@@ -27,19 +41,16 @@ In the same way that you moved Babel config, move Jest config from `jest` key of
2741
const { defaults: tsjPreset } = require('ts-jest/presets')
2842

2943
module.exports = {
30-
...tsjPreset,
3144
preset: 'react-native',
32-
transform: {
33-
...tsjPreset.transform,
34-
'\\.js$': '<rootDir>/node_modules/react-native/jest/preprocessor.js',
35-
},
3645
globals: {
3746
'ts-jest': {
38-
babelConfig: true,
47+
tsconfig: 'tsconfig.spec.json',
3948
},
4049
},
41-
// This is the only part which you can keep
42-
// from the above linked tutorial's config:
43-
cacheDirectory: '.jest/cache',
50+
transform: {
51+
'^.+\\.jsx$': 'babel-jest',
52+
'^.+\\.tsx?$': 'ts-jest',
53+
},
54+
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
4455
}
4556
```

website/versioned_docs/version-26.5/guides/react-native.md

Lines changed: 20 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -18,28 +18,37 @@ module.exports = {
1818
}
1919
```
2020

21+
### TypeScript Configuration
22+
23+
Create a new `tsconfig.spec.json` at the root of your project with the following content
24+
25+
```json
26+
// tsconfig.spec.json
27+
{
28+
"extends": "./tsconfig.json",
29+
"compilerOptions": {
30+
"jsx": "react"
31+
}
32+
}
33+
```
34+
2135
### Jest config
2236

2337
In the same way that you moved Babel config, move Jest config from `jest` key of `package.json` to `jest.config.js`. It should look like this:
2438

2539
```js
2640
// jest.config.js
27-
const { defaults: tsjPreset } = require('ts-jest/presets')
28-
2941
module.exports = {
30-
...tsjPreset,
3142
preset: 'react-native',
32-
transform: {
33-
...tsjPreset.transform,
34-
'\\.js$': '<rootDir>/node_modules/react-native/jest/preprocessor.js',
35-
},
3643
globals: {
3744
'ts-jest': {
38-
babelConfig: true,
45+
tsconfig: 'tsconfig.spec.json',
3946
},
4047
},
41-
// This is the only part which you can keep
42-
// from the above linked tutorial's config:
43-
cacheDirectory: '.jest/cache',
48+
transform: {
49+
'^.+\\.jsx$': 'babel-jest',
50+
'^.+\\.tsx?$': 'ts-jest',
51+
},
52+
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
4453
}
4554
```

website/versioned_docs/version-27.0/guides/react-native.md

Lines changed: 20 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -18,28 +18,37 @@ module.exports = {
1818
}
1919
```
2020

21+
### TypeScript Configuration
22+
23+
Create a new `tsconfig.spec.json` at the root of your project with the following content
24+
25+
```json
26+
// tsconfig.spec.json
27+
{
28+
"extends": "./tsconfig.json",
29+
"compilerOptions": {
30+
"jsx": "react"
31+
}
32+
}
33+
```
34+
2135
### Jest config
2236

2337
In the same way that you moved Babel config, move Jest config from `jest` key of `package.json` to `jest.config.js`. It should look like this:
2438

2539
```js
2640
// jest.config.js
27-
const { defaults: tsjPreset } = require('ts-jest/presets')
28-
2941
module.exports = {
30-
...tsjPreset,
3142
preset: 'react-native',
32-
transform: {
33-
...tsjPreset.transform,
34-
'\\.js$': '<rootDir>/node_modules/react-native/jest/preprocessor.js',
35-
},
3643
globals: {
3744
'ts-jest': {
38-
babelConfig: true,
45+
tsconfig: 'tsconfig.spec.json',
3946
},
4047
},
41-
// This is the only part which you can keep
42-
// from the above linked tutorial's config:
43-
cacheDirectory: '.jest/cache',
48+
transform: {
49+
'^.+\\.jsx$': 'babel-jest',
50+
'^.+\\.tsx?$': 'ts-jest',
51+
},
52+
moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
4453
}
4554
```

0 commit comments

Comments
 (0)