Switch to use `hermes-eslint` as the recommended parser about eslint-plugin-ft-flow

[bradzacher]

Just published v0.9.0 with the updated docs.
also @mrtnzlml this release includes import.meta support

[bradzacher]

Also as an aside, @Brianzchen, we could convert this repo to use flow if you wanted.
I've got flow types for ESLint based off of the types included in the hermes-estree package.

Internally at meta we have over 400 rules written with flow types! It's a much nicer experience authoring ESLint rules with types 😄!

[bradzacher]

Sorry, we probably could spruce up the docs.. Or rather add any docs at all heh. I'll look at doing that next week!

Hermes is Meta's JavaScript VM. It's primarily used to power react native.
As it's a VM, it also has a parser.

This parser is built with first-class support of flow syntax and its designed with performance in mind.

hermes-eslint (like @babel/eslint-parser) is a package designed to be the parser for ESLint. It uses Hermes' parser (compiled to WASM) to parse the code and outputs the AST in the latest ESTree format (I.e. It is fully compatible with ESLint v8+).

Unlike babel, hermes-eslint also includes a fully featured scope analyser which has full support for flow features - including types!!
This means (as I mentioned in the OP) we don't need extra hacky compatibility rules to teach eslint core rules about flow types or JSX!

At Meta we have been using hermes-eslint to power our linting in our largest repo for about a year. For context that is well over 550k files. This week I also migrated another repo to use it, which is another few hundred thousand files. So it's well and truly battle tested and hardened to say the least!

In terms of using it - nothing special is required. Just install the package and set parser: 'hermes-eslint' in the eslint config!

[Brianzchen]

Thanks, I've been sick these past few days but I'll look into this next weekend once I'm better

[bradzacher]

weird - I did cleanup the docs, but for some reason they didn't publish with the release.
I'm working on another release today so i'll make sure the docs update is shipped with it

[pascalduez]

Hey there,

I trying out a migration from @babel/eslint-parser to hermes-eslint, and eslint-plugin-flowtype to eslint-plugin-ft-flow.

I had to disable the ft-flow/space-after-type-colon rule in addition to those mentioned above. It raises errors in place where it should not.

For instance on line breaks:

foo?:
  | Foo
  | Bar

[Brianzchen]

@pascalduez working on the upgrade now. Looks like there are some rules that definitely need fixing and on top of that will need to run assertions tests on both babel and hermes...

https://github.com/flow-typed/eslint-plugin-ft-flow/actions/runs/5697988866/job/15445355957?pr=41#step:10:3761

[mrtnzlml]

@bradzacher Would you happen to have more information about the hermes-eslint parser? The only thing I could find is https://www.npmjs.com/package/hermes-eslint and it's not very welcoming. It doesn't seem to be open-sourced, and it doesn't explain very much what is it and what is the motivation to use it (over traditional parsers commonly used nowadays). Thanks! :)

Edit: is it related to https://github.com/facebook/hermes? I am lost on the React Native part. 🤔

[mrtnzlml]

Thanks, @bradzacher! Want to give it a try! 👍 Is facebook/hermes the correct repo for reporting bugs/asking questions? I've tried it in my monorepo, and I encountered some bumps (some parsing errors, unclear how to deal with Flow enums); you can see it here: adeira/universe#4583

[bradzacher]

@mrtnzlml
The import.meta support is missing (TBH I didn't know flow supported it!!!)
I'll talk to the hermes team about adding support for it.

For the no-unused-vars error on your enums - that's actually a completely correct error that you'll now get! Because hermes-eslint has a scope analyser that understands flow - it can keep track of things like types and enums as well as where they're used.
So in your file the three enums StatusDefault2, StatusString2 and StatusNumber2 are all not used anywhere - hence they're being flagged by no-unused-vars!

[mrtnzlml]

For the no-unused-vars error on your enums - that's actually a completely correct error that you'll now get! Because hermes-eslint has a scope analyser that understands flow - it can keep track of things like types and enums as well as where they're used.

Ah, right, I didn't realize this. Very cool! 😊 Thanks for your help!

[Brianzchen]

Hi @bradzacher doing some testing here, works pretty well on my source code but when I parse my dist (which people normally don't) with hermes-eslint it crashes but with @babel/eslint-parser it does not

Also going through the limited docs

your project you must specify "hermes-eslint" as the "parser"

But the code snippet references "parser": "hermes-parser" this is correct? Not quite sure which it's meant to be

[bradzacher]

If you can isolate the code that's crashing then I can get this fixed up!

It looks like it was a property.
If you run eslint with --debug I think it'll show more info to help pinpoint?

---

The docs are wrong sorry. I forgot to go and get them update this week sorry. I'll make a note to do it on Monday.

[Brianzchen]

@bradzacher just fyi I haven't forgotten this change! I'm just waiting for doc updates before I start digging into this further