error TS roblox-ts: compilerOptions.jsxFactory must be `Roact.createElement`
Compiler saying I need to use "Roact.createElement" in "compilerOptions.jsxFactory" when using React
I'm using flamework and react
File in question:
// Error message
src/client/components/ui/plusOneEffect.tsx:13:13 - error TS roblox-ts: compilerOptions.jsxFactory must be `Roact.createElement`!
13 return (<textlabel Text={"+1"} Font={"Bangers"} TextScaled={true} Position={position} AnchorPoint={new Vector2(0.5, 0.5)}/>);
// Error message
src/client/components/ui/plusOneEffect.tsx:13:13 - error TS roblox-ts: compilerOptions.jsxFactory must be `Roact.createElement`!
13 return (<textlabel Text={"+1"} Font={"Bangers"} TextScaled={true} Position={position} AnchorPoint={new Vector2(0.5, 0.5)}/>);
import React, { Component, ReactComponent } from "@rbxts/react";
import { Functions } from "client/network";
import { useMotion } from "./useMotionAndEffect";
import PlusOneEffect from "./plusOneEffect";
interface ClickerButtonProps {
}
interface ClickerButtonState {
}
export default function ClickerButton() {
return (
<textbutton
Text={"Click Me"}
Size={new UDim2(0.1, 0, 0.1, 0)}
Event={{
MouseButton1Click: async () => {
let clickRegistered: boolean = await Functions.registerClick.invoke()
if (clickRegistered === true) {
<PlusOneEffect />
}
}
}}
children = {
<>
<uicorner
CornerRadius={new UDim(0.2, 0)}
/>
<uiaspectratioconstraint
AspectRatio={1}
AspectType={Enum.AspectType.FitWithinMaxSize}
DominantAxis={Enum.DominantAxis.Width}
/>
</>
}
/>
)
}
import React, { Component, ReactComponent } from "@rbxts/react";
import { Functions } from "client/network";
import { useMotion } from "./useMotionAndEffect";
import PlusOneEffect from "./plusOneEffect";
interface ClickerButtonProps {
}
interface ClickerButtonState {
}
export default function ClickerButton() {
return (
<textbutton
Text={"Click Me"}
Size={new UDim2(0.1, 0, 0.1, 0)}
Event={{
MouseButton1Click: async () => {
let clickRegistered: boolean = await Functions.registerClick.invoke()
if (clickRegistered === true) {
<PlusOneEffect />
}
}
}}
children = {
<>
<uicorner
CornerRadius={new UDim(0.2, 0)}
/>
<uiaspectratioconstraint
AspectRatio={1}
AspectType={Enum.AspectType.FitWithinMaxSize}
DominantAxis={Enum.DominantAxis.Width}
/>
</>
}
/>
)
}
// tsconfig.json
"jsx": "react",
"jsxFactory": "React.createElement",
"jsxFragmentFactory": "React.Fragment",
// tsconfig.json
"jsx": "react",
"jsxFactory": "React.createElement",
"jsxFragmentFactory": "React.Fragment",
5 Replies