question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Flow typed JSX syntax regression in v1.6.0

See original GitHub issue

Repro:

https://prettier.io/playground/#{"content"%3A"let child%3A Element<any> %3D <img src%3D{url} key%3D\"img\" %2F>%3B"%2C"options"%3A{"printWidth"%3A80%2C"tabWidth"%3A2%2C"singleQuote"%3Afalse%2C"trailingComma"%3A"none"%2C"bracketSpacing"%3Atrue%2C"jsxBracketSameLine"%3Afalse%2C"parser"%3A"babylon"%2C"semi"%3Atrue%2C"useTabs"%3Afalse%2C"doc"%3Afalse%2C"ast"%3Afalse}}

Input:

let child: Element<any> = <img src={url} key="img" />;

Error message:

SyntaxError: Unexpected token, expected , (1:32)
> 1 | let child: Element<any> = <img src={url} key="img" />;
    |                                ^

If you add parentheses around the expression it will parse, but the output will not include the parentheses so the output is not parseable. A workaround that is idempotent with respect to prettier is to use an inline annotation.

let child = (<img src={url} key="img" />: Element<any>);

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:5 (1 by maintainers)

github_iconTop GitHub Comments

1reaction
existentialismcommented, Aug 29, 2017

@etrepum yeah I fixed that bug recently too, thanks again for the bug report!

1reaction
vjeuxcommented, Aug 29, 2017

I just shipped 1.6.1 that contains this fix! Thanks for reporting it!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Releases · flow-typed/flow-typed - GitHub
A central repository for Flow library definitions. Contribute to flow-typed/flow-typed development by creating an account on GitHub.
Read more >
Flow to TypeScript migration journey - TkDodo's blog
We evaluated flow-to-ts, which could automatically migrate existing flow types to TypeScript. It worked quite well, but a lot of syntax errors ...
Read more >
@babel/plugin-syntax-flow | Yarn - Package Manager
Fast, reliable, and secure dependency management.
Read more >
Firebase JavaScript SDK Release Notes - Google
Fixed a regression that prevented Cloud Firestore from detecting the Authentication service during initialization, which prevented some writes from being sent.
Read more >
Changelog - JavaScript Standard Style
Fix: Ensure we support all of the latest syntax that ESLint 8 includes, ... Update eslint-config-standard-jsx from 10.0.0 to 11.0.0-0 to adapt to...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found