https://github.com/littensy/rbxts-react
⚛️ TypeScript definitions for React Lua.
https://github.com/littensy/rbxts-react
react roblox roblox-ts typescript
Last synced: 6 days ago
JSON representation
⚛️ TypeScript definitions for React Lua.
- Host: GitHub
- URL: https://github.com/littensy/rbxts-react
- Owner: littensy
- License: mit
- Created: 2024-02-15T09:40:25.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2025-11-30T21:41:10.000Z (6 months ago)
- Last Synced: 2026-04-24T20:00:07.990Z (about 1 month ago)
- Topics: react, roblox, roblox-ts, typescript
- Language: Lua
- Homepage: https://npmjs.com/package/@rbxts/react
- Size: 1.64 MB
- Stars: 47
- Watchers: 1
- Forks: 11
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE.md
Awesome Lists containing this project
- awesome-react-lua - **Repository**
README
# [`@rbxts/react-ts`](https://www.npmjs.com/package/@rbxts/react-ts)
To allow React in Roblox-TS, this package combines `jsdotlua/react` and `jsdotlua/roact-compat` and re-exports them with typings from `@rbxts/roact` some types from [the DefinitelyTyped package](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/react/v17/index.d.ts).
The package also needs to be installed with an alias to trick the compiler into using this package instead of the _actual_ Roact package.
> [!IMPORTANT]
> This package is superseded by [littensy/rbxts-react](https://github.com/littensy/rbxts-react).
## 📦 Installation
### ⚛️ React for Roblox-TS
For this package to work, it needs the `@rbxts/roact` alias so that Roblox-TS can use this package for your TSX files.
You can install with an alias like so:
```bash
npm install @rbxts/roact@npm:@rbxts/react-ts@latest
yarn add @rbxts/roact@npm:@rbxts/react-ts@latest
pnpm add @rbxts/roact@npm:@rbxts/react-ts@latest # SEE NOTE BELOW
```
Make sure the following alias or something similar is in your `package.json`:
```json
"dependencies": {
"@rbxts/roact": "npm:@rbxts/react-ts",
}
```
#### ⚠️ Note for pnpm users
PNPM symlinks packages by default, which doesn't work well with Rojo. You can disable this behavior by adding the following to your `.npmrc`:
```properties
node-linker=hoisted
```
### 📎 ReactRoblox
You can install `@rbxts/react-roblox` to render React components with `createRoot` instead of `Roact.mount`.
```bash
npm install @rbxts/react-roblox
yarn add @rbxts/react-roblox
pnpm add @rbxts/react-roblox
```
## ✅ Compatibility
Installing this package will install React, ReactRoblox, etc. directly under the `@rbxts` folder in located ReplicatedStorage.
If your package depends on React packages, they may be imported in Luau via `require(script.Parent...Parent.MODULE)` or `require(...node_modules["@rbxts"].MODULE)` depending on your project structure.
See explorer view
## 📋 Sources
Types are derived from [DefinitelyTyped](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/react/v17/index.d.ts).
Dependencies of this package were published from [littensy/react-lua](https://github.com/littensy/react-lua), which is a fork of [jsdotlua/react-lua](https://github.com/jsdotlua/react-lua).