Search code examples
reactjstypescriptprettier

Prettier conflicts with ?. (question mark and dot) in typescript-react inside of prop-brackets with syntax error


Expression

<Button
        title={props.children?.toString()}
        buttonStyle={$.buttonStyle}
        titleStyle={$.titleStyle}

      />

gives next error

SyntaxError: Expression expected.
title={props.children?.toString()}
                      ^

Are there any ways to fix it?
Eslint with prettier-plugin gives the same error. Problem with parser-typescript.js


Solution

  • The propblem is in a new version of Prettier 4.5.0
    If you downgrade your prettier to v4.0.0 - your problem will collapse :)