'How to import QR reader Typescript package in React?

Using a QR code reader in my React / Typescript app. Importing both file in package.json:

"qrcode.react": "^1.0.1",
"@types/qrcode.react": "^1.0.1",

also importing it:

import QRCode from 'qrcode.react'

And using it in return.

<QRCode className={styles.qrcode}

It works, but VS Code raise a warning:

'QRCode' cannot be used as a JSX component.
  Its instance type 'Component<CanvasQRCodeProps | SvgQRCodeProps, any, any>' is not a valid JSX element.
    The types returned by 'render()' are incompatible between these types.
      Type 'React.ReactNode' is not assignable to type 'import("/Users/kukodajanos/Workspace/Tikex/Portal/Team/node_modules/@types/react-date-range/node_modules/@types/react/index").ReactNode'.
        Type '{}' is not assignable to type 'ReactNode'.ts(2786)

How to fix warning?



Solution 1:[1]

yarn upgrade [email protected]

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Gino Mempin