Create-react-app: doesn't respect .eslintignore

[oriSomething]

Can you reproduce the problem with latest npm?

yes

Description

create-react-app 1.x doesn't respect .eslintignore. (It was use to respect it on version 0.9.x).

Expected behavior

Not showing ESLint warning/errors of files in the .eslintignore file

Actual behavior

See warning such as:

Compiled with warnings.

./src/vendor/modernizr.js
  Line 25:   Shadowing of global property 'undefined'     no-shadow-restricted-names
  Line 163:  Do not use Boolean as a constructor          no-new-wrappers
  Line 431:  Unexpected string concatenation of literals  no-useless-concat
  Line 436:  Expected '===' and instead saw '=='          eqeqeq

Search for the keywords to learn more about each warning.
To ignore, add // eslint-disable-next-line to the line before.

Environment

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

1. npm ls react-scripts (if you haven’t ejected): [email protected]
2. node -v: v6.10.0
3. yarn -v: v0.24.5

Then, specify:

1. Operating system: OSX Sierra
2. Browser and version: *

Reproducible Demo

.eslintignore :

vendor/*.js
src/vendor/*.js
src/vendor/vendor.js

src/vendor.js:

(function(undefined) {
  var a = 1;
  var b = a == 1;
  window.$someProp$ = b;
}());

src/index.js:

import "./vendor/vendor.js";

[Timer]

CRA 1.x+ purposely does not support .eslintignore. Sorry!

Please move vendor files into public/ or use a NPM package.

[oriSomething]

But that's a problem because than I can't import it inside the project. Moreover, if it's on the public path and I can't import it, it means more network request for a tiny file that Modernizr 3 creates.

[Timer]

Does npm install modernizr not yield a valid package that can be used?

[oriSomething]

modernizr@3 unlike previous versions is a package to create the file you'll import in your project, And not the Modernizrobject itself. So, I can't use it in the browser in anyway. I can only use it to create the needed file like this:

yarn run modernizr -- -c modernizr-config.json -d 'src/vendor/modernizr.js

[Timer]

I see. If you must opt out, simply add /* eslint-disable */ to the beginning of the file.

[oriSomething]

That's what I'm doing now as a work around. I've just hope I could use more elegant way for automated file creation.

Thanks though

[sonarforte]

@oriSomething I've been trying to do this with no luck. I have the output modernizr.js file, but how do I import and then use it in my code?

if I do import Modernizr from 'path/to/modernizr.js', printing Modernizr just shows an empty object.

[oriSomething]

@sonarforte Hey, Modernizr creates a file which doesn't play with ES6 module. It uses browser globals. So using it it's like this:

import "./path/to/modernizr";

const { Modernizr } = window;

[TennyZhuang]

really need .eslintignore for *_pb.js produced by protobuf, is there some workaround now?

[TheCodeDestroyer]

CRA 1.x+ purposely does not support .eslintignore. Sorry!

Is there a valid reason for this?
I'm using Swagger Codegen to generate client HTTP calls which get imported into wrappers and since the code is auto generated there are bunch of eslint issues...

[Timer]

See https://github.com/facebookincubator/create-react-app/pull/2115 for context.
You can use /* eslint-disable */ to opt-out of a file being linted.

[TheCodeDestroyer]

@Timer so every time I generate whole bunch of code I have to prepend /* eslint-disable */ to each and every file generated?

[Timer]

It seems like swagger supports templates which would allow you to place /* eslint-disable */ at the top of each generated file.
Otherwise, a simple node script would do that runs post-build to prepend /* eslint-disable */ to each file.

tl;dr yes, but don't do this by hand

[TheCodeDestroyer]

Really swagger codegen supports templates? Didn't know that...

Anyways thanks for your help!

[lileilei]

package.json "eslintIgnore": ["src/lib/**"]

[oriSomething]

@lileilei You will still see errors on browser's devTools

[lileilei]

@oriSomething But, I'm ok. You try to check your path

[hunnain]

/* eslint-disable */ where we want to add this line in react

[lileilei]

@oriSomething sorry ，package.json set "eslintIgnore": ["src/lib/**"] ，It only works in eject mode

[skwid138]

@oriSomething Your suggestion to add eslintIgnore to package.json worked for me. I had ejected then added src/.eslintrc.json and was having issues with registerServiceWorker.js being linted .

This worked -> "eslintIgnore": ["src/registerServiceWorker.js"]
This did not -> "eslintIgnore": ["./src/registerServiceWorker.js"]

In case anyone else is having issues the path is strict.