create-react-app: Build error `no-undef` for flowtypes with class properties

Can you reproduce the problem with npm 4.x?

Yes

Description

An error when running yarn run build occurs if I add a class property with a type to a react component. E.g.

interface MyType {
  what?: string;
}

// works fine
var status: MyType = {};
console.log(status);

class App extends Component {
  // no-undef build error
  state: MyType = {};
  render() {
...

Expected behavior

✨ Done in 11.24s.

Actual behavior

./src/App.js
  Line 16:  'state' is not defined  no-undef

Search for the keywords to learn more about each error.

error Command failed with exit code 1.

Note that yarn run flow raises no issue. So I’m guessing it’s an eslint problem but there’s no way to tell from the build output. Would be nice if the errors were tagged with their source (vs code does this in the problems panel).

Environment

Run these commands in the project folder and fill in their results:

npm ls react-scripts (if you haven’t ejected): react-scripts@1.0.7
node -v: v7.9.0
npm -v: 4.6.1

Then, specify:

Operating system: macOS 10.12.5 (16F73), uname -a: Darwin yuv 16.6.0 Darwin Kernel Version 16.6.0: Fri Apr 14 16:21:16 PDT 2017; root:xnu-3789.60.24~6/RELEASE_X86_64 x86_64
Browser and version: This is a command line build issue

Reproducible Demo

https://github.com/ubershmekel/create-react-app-flowtypes

About this issue

Original URL
State: closed
Created 7 years ago
Reactions: 6
Comments: 16 (10 by maintainers)

Most upvoted comments

@gaearon I just updated to the newest CRA and this seems to have popped up again for me. I’m wondering now that CRA uses eslint 4 is this is a bug now? Is anyone else running into this?

+17

chrisdrackett on Oct 23, 2017

In the meantime, downgrading my own version to 3.19 cleared everything up.

JeffreyATW on Jun 26, 2017

i my case conflict with react-script removing react-script solved my problem

vladimirvorobiev on May 17, 2018

+1, still getting this

dancherb on Apr 26, 2018

In v4.13.1, stil pop

zzuhan on Dec 20, 2017

I gave this a 👍 earlier, but I just downloaded your example and can’t reproduce the error. I’m using Node 7.10.0, if it matters.

The weird part is, I can still reproduce similar problems on my own project. For one of my components:

export default class Something extends Component {
  props: {
    foo: string,
  };

results in:

'props' is not defined no-undef

Weirder still, and I’m not sure if it’s related, I have another component where adding an arrow function property:

export default class SomethingElse extends Component {
  handleChange = (event) => {
    console.log(event);
  };