I've changed my .js file to .tsx and am getting errors in a component:

    <ReactJoyride
        ... // other props 
        scrollDuration={scrollDurationState} // gives error
    />

I understand the error, which is as follows:

No overload matches this call.
  Overload 1 of 2, '(props: Props | Readonly<Props>): ReactJoyride', gave the following error.
      ...
Property 'scrollDuration' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<ReactJoyride> & Readonly<Props> & Readonly<{ children?: ReactNode; }>'.ts(2769)
(JSX attribute) scrollDuration: number

Now, I know that the error means that the prop I'm trying to provide to the component doesn't exist on the type definitions for the parameters for the ReactJoyride component. I believe this is a problem with the type file for the component, as when I comment the prop out, the behaviour of the component changes.

So I have a situation where I want to ignore the linter error. I've added a line above the error:

// @ts-ignore

But now this line is flagged with the warning:

Do not use "@ts-ignore" because it alters compilation errors.eslint@typescript-eslint/ban-ts-comment

I don't if there's something else I should be doing? I imagine I should specify what error I want to ignore, but the error message doesn't seem to be giving me a recognisable error string. Also I can't find the error reference number (.ts(2769)) to match it to anything? I've looked on Microsoft's diagnostic.Message.json file, for example, and it isn't included on there?