You can install it via npm i @rbxts/roact.
For a detailed guide and examples, check out the official Roact documentation. The Wiki on this repository will have guides on how to adapt to using typescript instead of Lua.
You will need the settings from roblox-ts, as well as:
{
"compilerOptions": {
"jsx": "react",
"jsxFactory": "Roact.jsx",
"jsxFragmentFactory": "Roact.Fragment",
},
}import Roact from '@rbxts/roact';
const LocalPlayer = game.GetService("Players").LocalPlayer as Player;
const PlayerGui = LocalPlayer.FindFirstChildOfClass("PlayerGui");
const tree = Roact.createElement("ScreenGui", {}, {
Label: Roact.createElement("TextLabel", {
Text: "Hello, World!",
Size: new UDim2(1, 0, 1, 0)
}),
});
Roact.mount(tree, PlayerGui, "HelloWorld");import Roact from '@rbxts/roact';
const LocalPlayer = game.GetService("Players").LocalPlayer as Player;
const PlayerGui = LocalPlayer.FindFirstChildOfClass("PlayerGui");
const tree = <screengui>
<textlabel Key="Label" Text="Hello, World!" Size={new UDim2(1, 0, 1, 0)}/>
</screengui>;
Roact.mount(tree, PlayerGui, "HelloWorld");The original Roact library's License can be found here: Roact License