如何在 react native 中解决这个 JSX 错误？

Question

Getting the below error on a new TS file containing JSX for React native:

Unexpected token, expected ","

Below is the code for the component I'm making. The error appears to

class TabLabel extends React.PureComponent<IReactionsLabelProps> {
    constructor(props: IReactionsLabelProps) {
        super(props);
    }

    render = () => {
        const { name, baseUrl, getCustomEmoji, reactions, page, theme } = this.props;

        return (
            <View style={ sharedStyles.tabView }>
                <Emoji
                    content={name}
                    standardEmojiStyle={sharedStyles.reactionEmoji}
                    customEmojiStyle={sharedStyles.reactionCustomEmoji}
                    baseUrl={baseUrl}
                    getCustomEmoji={getCustomEmoji}
                />
                <Text style={{
                    ...sharedStyles.textBold, color: themes[theme].bodyText
                }}>
                    { reactions[page]?.usernames?.length }
                </Text>
            </View>
        );
    }
}

The linter provides a different error near the "style" prop in the first line of the JSX: Parsing error: '>' expected

I am completely stuck and have no idea what's going wrong. Full file is available at https://github.com/RocketChat/Rocket.Chat.ReactNative/blob/b1f9916ed8f9a423e356987d934998a139809627/app/views/ReactionsView/index.ts#L45

Complete error below:

Answer 1

I'll answer my own question. And I feel exceedingly dumb now, needless to say, having spent literal hours trying to solve this.

Just had to change the extension of the file from.ts to.tsx, and it worked.