create-react-app: Building with babel-eslint fails on windows with class-properties
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
npx create-react-app my-app-name
npm install -D babel-eslint
- 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>
);
}
}
- 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.
About this issue
- Original URL
- State: closed
- Created 6 years ago
- Comments: 25 (9 by maintainers)
@gaearon Ok thanks. Hopefully someday we’ll get better IDE support for eslint configs other than “react-app”. I have editor lints and lint tasks for pre-commit and CI scripts that will continually lint my code for more than just the basic react-app errors.
But for now this works