Babel-eslint: Flowtype's new object spread gives parsing error

[niieani]

Flowtype's new feature, type object spread isn't getting parsed properly: https://github.com/facebook/flow/commit/ad443dc92879ae21705d4c61b942ba2f8ad61e4d

Example:

type A = {...TypeA, ...TypeB}

[danez]

This is an issue in babylon which does not support this syntax yet.

[niieani]

@danez Babylon issue was fixed!

[niieani]

The Babylon issue was fixed, but only in babylon ^7. babel-eslint is currently dependent on ^6. Any news on migration to ^7?

The nasty workaround is to use the comment-style Flow type:

export type A = {a: string}
export type B = {b: number}
/* :: type _C = {...A, ...B} */
export type C = _C

[architectcodes]

It’s a bit less ugly if you just comment out the spread type:

export type C = {
  /* :: ...A, */
  /* :: ...B, */
}

[AndreyKozlov1984]

The other possible fix is this:
Make a fork of babel-eslint, like https://github.com/ZeusTheTrueGod/babel-eslint
change the package.json so the dependency on babylon is "7.0.0-beta.8" and then run "yarn install". Now your babel-eslint uses the latest babylon parser. If you run yarn test then you'll see 2 failures regarding the name of AST elements, but they are false positives. push your changes back to your fork of the repo.

Now, in your main project, get rid of existing babel-eslint via yarn remove babel-eslint, and then add the modified version via, for example, yarn add --dev ZeusTheTrueGod/babel-eslint.

After that ensure that 1) eslint still works on your project 2) you can use object spread syntax without any further problems!

export type A = {a: string}
export type B = {b: number}
type C = {...A, ...B} 

[mjomble]

...change the package.json so the dependency on babylon is "7.0.0-beta.8"...

Actually, this should no longer be required as the change has also been backported to babylon 6.x: https://github.com/babel/babylon/pull/476

Furthermore, a specific fix for this has been applied to babel-eslint: #465

So all we need is a new babel-eslint release, for which even the version number update has already been made: 94bb5a1d36

But the actual release has not yet been made. @zertosh @kittens @danez do you have more info?

[AndreyKozlov1984]

@mjomble , everything worked from yarn:

yarn remove --dev babel-eslint
yarn add --dev babel-eslint

That installed a 7.2.3 version, not sure why, because that tag is not present in a github repo.

[mjomble]

Ah, weird, I guess the new release was pushed to npm, but wasn't created on Github.

[AndreyKozlov1984]

@lgraziani2712 Same issue!
It seems like latest babel / babylon is not used in the webpack chain. I disabled those extra rules, but still nothing helped. I'm researching the issue at this moment

[lgraziani2712]

**, I removed the comment sorry!

I said that @ZeusTheTrueGod comment solved the babel-eslint issue but I get a new one.

BTW, that new one is related to eslint-plugin-react. Nothing to do here I think.

[AndreyKozlov1984]

It seems like we need a babel 7 in a webpack in order to get this working. Only babel 7 depends on a babylon 7!

[lgraziani2712]

Uhmm, I just disabled react/prop-types: 2 from my eslint config file, and stopped complaining, so I can confirm is an eslint-plugin-react issue, specifically with prop-types rule.

Edit: reported https://github.com/yannickcr/eslint-plugin-react/issues/1178

[AndreyKozlov1984]

Ok, so here is what I've found - if you don't have an up-to date babel-core at least 6.24.1 - then even that simple babel command on a file containing type X={...Y} will fail. May be that will help someone to fix an issue in the future

[rosskevin]

If anyone can spot the error in my attempt, please let me know, here is a repo:
https://github.com/rosskevin/babel-eslint-473-flow-spread

[rsolomon]

@rosskevin I'm experiencing the same issue, and opened a ticket for it here:

https://github.com/babel/babel-eslint/issues/488

I still believe that it is not fully supported in 6.25.0