Skip to content
GitLab
Projects Groups Snippets
  • /
  • Help
    • Help
    • Support
    • Community forum
    • Submit feedback
    • Contribute to GitLab
  • Sign in / Register
  • C create-react-app
  • Project information
    • Project information
    • Activity
    • Labels
    • Members
  • Repository
    • Repository
    • Files
    • Commits
    • Branches
    • Tags
    • Contributors
    • Graph
    • Compare
  • Issues 1,547
    • Issues 1,547
    • List
    • Boards
    • Service Desk
    • Milestones
  • Merge requests 417
    • Merge requests 417
  • CI/CD
    • CI/CD
    • Pipelines
    • Jobs
    • Schedules
  • Deployments
    • Deployments
    • Environments
    • Releases
  • Packages and registries
    • Packages and registries
    • Package Registry
    • Infrastructure Registry
  • Monitor
    • Monitor
    • Incidents
  • Analytics
    • Analytics
    • Value stream
    • CI/CD
    • Repository
  • Wiki
    • Wiki
  • Snippets
    • Snippets
  • Activity
  • Graph
  • Create a new issue
  • Jobs
  • Commits
  • Issue Boards
Collapse sidebar
  • Meta
  • create-react-app
  • Issues
  • #5207
Closed
Open
Issue created Oct 01, 2018 by Administrator@rootContributor

Building with babel-eslint fails on windows with class-properties

Created by: JeffBaumgardt

Is this a bug report?

Yes

Did you try recovering your dependencies?

Yes

Which terms did you search for in User Guide?

Yes

Environment

Note npx create-react-app --info is not working on Windows 10

System: Windows 10 NPM: 6.0.0 Node: 10.10.0 React-scripts: 1.1.5

Steps to Reproduce

  1. npx create-react-app my-app-name
  2. npm install -D babel-eslint
  3. Modify App.js to include state as a class-property
class App extends Component {
  state = {
    message: "Hello React App"
  };
  render() {
    const { message } = this.state;
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h1 className="App-title">{message}</h1>
        </header>
        <p className="App-intro">
          To get started, edit <code>src/App.js</code> and save to reload.
        </p>
      </div>
    );
  }
}
  1. Run npm run build

Expected Behavior

I would expect the build to complete as expected.

Actual Behavior

The build fails with the error no-undef for the state that was defined in the component

PS C:\Node\windows-build-failure> npm run build

> windows-build-failure@0.1.0 build C:\Node\windows-build-failure
> react-scripts build

Creating an optimized production build...
Failed to compile.

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

Search for the keywords to learn more about each error.


npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! windows-build-failure@0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the windows-build-failure@0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\jbaumgardt\AppData\Roaming\npm-cache\_logs\2018-10-01T19_01_21_162Z-debug.log

Reproducible Demo

As shown above, I can clone the repo and share if you wish, I only added a state class-property and installed babel-eslint.

In my real-world example I have a .eslintrc file for additional lint rules for VSCode to enforce more lint rules in development and pre-commit.

If I remove babel-eslint dependency the build will work.

Assignee
Assign to
Time tracking