If you're starting a new project, there are a few different ways to get started. You can use the TypeScript template:
Note If the above command is failing, you may have old version of
react-native-cliinstalled globally on your pc. Try uninstalling the cli and run the cli using
You can use Expo which has two TypeScript templates:
Or you could use Ignite, which also has a TypeScript template:
- Add TypeScript and the types for React Native and Jest to your project.
- Add a TypeScript config file. Create a
tsconfig.jsonin the root of your project:
- Create a
jest.config.jsfile to configure Jest to use TypeScript
You should leave the
./index.jsentrypoint file as it is otherwise you may run into an issue when it comes to bundling a production build.
yarn tscto type-check your new TypeScript files.
You can provide an interface for a React Component's [Props]](props) and [State]](state) via
React.Component<Props, State> which will provide type-checking and editor auto-completing when working with that component in JSX.
You can explore the syntax more in the TypeScript playground.
- TypeScript Handbook
- React's documentation on TypeScript
- React + TypeScript Cheatsheets has a good overview on how to use React with TypeScript
To use custom path aliases with TypeScript, you need to set the path aliases to work from both Babel and TypeScript. Here's how:
- Edit your
tsconfig.jsonto have your custom path mappings. Set anything in the root of
srcto be available with no preceding path reference, and allow any test file to be accessed by using
- Configure the Babel side done by adding a new dependency,
- Finally, configure your
babel.config.js(note that the syntax for your
babel.config.jsis different from your