mirror of
https://github.com/facebook/react-native.git
synced 2025-11-01 09:14:26 +00:00
Kræn Hansen
0198c92c71
Summary:
Extending a tsconfig seems simpler than adding `compilerOptions` with `customConditions`.
### Before
```jsonc
{
"extends": "react-native/typescript-config",
"compilerOptions": {
// ...
"customConditions": ["react-native-strict-api", "react-native"]
}
}
```
### After
```jsonc
{
"extends": "react-native/typescript-config/strict"
// ...
}
```
## Changelog:
[GENERAL] [ADDED] - Add `react-native/typescript-config/strict` export enabling the `react-native-strict-api` custom condition.
Pull Request resolved: https://github.com/facebook/react-native/pull/53564
Test Plan:
### `package.json`
```
{
"name": "react-native-ts-test",
"private": true,
"version": "0.1.0",
"scripts": {
"build": "tsc --noEmit"
},
"devDependencies": {
"react-native/typescript-config": "^0.81.1",
"typescript": "^5.9.2",
"jest": "^30.1.2"
},
"dependencies": {
"react-native": "^0.81.1"
}
}
```
### `tsconfig.json`
```
{
"extends": "react-native/typescript-config/strict",
"include": ["src/index.ts"]
}
```
### `src/index.ts`
```
import { View } from "react-native";
```
Run `npx resolution-explorer` and select "react-native from src/index.ts to node_modules/react-native/types_generated/index.d.ts" to verify the types are resolved correctly.
```
Explicitly specified module resolution kind: 'Bundler'.
Resolving in CJS mode with conditions 'import', 'types', 'react-native-strict-api'.
File '/Users/kraen.hansen/Repositories/react-native-ts-test/src/package.json' does not exist.
Found 'package.json' at '/Users/kraen.hansen/Repositories/react-native-ts-test/package.json'.
Loading module 'react-native' from 'node_modules' folder, target file types: TypeScript, JavaScript, Declaration, JSON.
Searching all ancestor node_modules directories for preferred extensions: TypeScript, Declaration.
Directory '/Users/kraen.hansen/Repositories/react-native-ts-test/src/node_modules' does not exist, skipping all lookups in it.
Found 'package.json' at '/Users/kraen.hansen/Repositories/react-native-ts-test/node_modules/react-native/package.json'.
Entering conditional exports.
Matched 'exports' condition 'react-native-strict-api'.
Using 'exports' subpath '.' with target './types_generated/index.d.ts'.
File '/Users/kraen.hansen/Repositories/react-native-ts-test/node_modules/react-native/types_generated/index.d.ts' exists - use it as a name resolution result.
'package.json' has a 'peerDependencies' field.
Resolving real path for '/Users/kraen.hansen/Repositories/react-native-ts-test/node_modules/react-native', result
'/Users/kraen.hansen/Repositories/react-native-ts-test/node_modules/react-native'.
Failed to find peerDependency 'types/react'.
Found 'package.json' at '/Users/kraen.hansen/Repositories/react-native-ts-test/node_modules/react/package.json'.
Found peerDependency 'react' with '19.1.1' version.
Resolved under condition 'react-native-strict-api'.
Exiting conditional exports.
Resolving real path for '/Users/kraen.hansen/Repositories/react-native-ts-test/node_modules/react-native/types_generated/index.d.ts', result
'/Users/kraen.hansen/Repositories/react-native-ts-test/node_modules/react-native/types_generated/index.d.ts'.
======== Module name 'react-native' was successfully resolved to
'/Users/kraen.hansen/Repositories/react-native-ts-test/node_modules/react-native/types_generated/index.d.ts' with Package ID
'react-native/types_generated/index.d.ts@0.81.1+react@19.1.1'. ========
```
Reviewed By: robhogan
Differential Revision: D82791201
Pulled By: philIip
fbshipit-source-id: f58d3b8fcf3d7f18dd29eef18a3c8c0cb57d1d78
@react-native/typescript-config
This package provides the default tsconfig.json used by newly built React Native apps.
This template is customized for specific versions of React Native, and should be updated in sync with the rest of your app.
Strict TypeScript API
To opt into the new strict TypeScript API you can extend from @react-native/typescript-config/strict
{
"extends": "@react-native/typescript-config/strict",
// ...
}
or alternatively add the customConditions yourself:
{
"extends": "@react-native/typescript-config",
"compilerOptions": {
// ...
"customConditions": ["react-native-strict-api", "react-native"]
}
}