Skip to content

Commit

Permalink
Add TypeScript support page
Browse files Browse the repository at this point in the history
  • Loading branch information
fabioh8010 authored and necolas committed Oct 1, 2024
1 parent 54c14d6 commit 1e39c2d
Show file tree
Hide file tree
Showing 2 changed files with 63 additions and 1 deletion.
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ description:
eleventyNavigation:
key: Help
parent: Start
order: 6
order: 7
---

:::lead
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,62 @@
---
title: TypeScript support
date: Last Modified
permalink: /docs/typescript-support/index.html
eleventyNavigation:
key: TypeScript support
parent: Start
order: 6
---

:::lead
How to add TypeScript support to your project.
:::

The type definitions for `react-native-web` are available on [DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/react-native-web).

---

## Installation

Simply install the following dependency in your project.

```shell
npm install --save-dev @types/react-native-web
```

The package comes with the `react-native-web` declaration types, so you can use it normally in your project.

```ts
import { AppRegistry } from 'react-native-web';
```

---

## Using it in React Native projects

To extend the `react-native` types, you have to supply `react-native-web` as a member of the `types` compiler option in the `tsconfig.json` file.

```json
{
...
"compilerOptions": {
"types": ["react-native-web"]
}
}
```

Now you can use `react-native` components in your project with TS support to `react-native-web` props and styles :tada:

```jsx
import { View, ViewStyle } from 'react-native';

const style: ViewStyle = {
position: "fixed", // RN style properties are augmented with Web-only options e.g. 'fixed'
marginBlock: "auto", // All Web CSS style properties are also available to use
};

<View
href="https://necolas.github.io/react-native-web/" // RNW prop
style={style}
/>
```

0 comments on commit 1e39c2d

Please sign in to comment.