13

I use facebook's create-react-app, which intentionally hide all the configuration setup, and leave us with a lovely simple file structure

a lovely file structure

That's great! but there's one really annoying thing that come up:

SublimeLinter is no longer works because the .eslintrc configuration file is not longer at the root of the project.

Key points

  • I know I can put another .eslintrc file at the root, but I would like to be able to set my rules in one place

  • I know it is possible to npm eject to get the entire project structure out in front, but I would like to keep things simple. otherwise it becomes just another boilerplate

  • I noticed that in the package.json a clue inside the package.json

What I already tried?

a direction I thought about is to change:

"eslintConfig": {
   "extends": "./node_modules/react-scripts/config/eslint.js"
}

to:

"eslintConfig": {
   "extends": "./.eslintrc.js"
}

but it seems to require all the eslint-plugins (which are magically hidden from node_modules) so I'm not sure it's the right way.

Any insights?

Asaf Katz
  • 4,608
  • 4
  • 37
  • 42

1 Answers1

17

SublimeLinter is no longer works because the .eslintrc configuration file is not longer at the root of the project.

This is not correct.

SublimeLinter will work just fine but you currently have to install a few things globally. The generated project’s README includes the instructions to get linter IDE integration working:

Finally, you will need to install some packages globally:

npm install -g eslint babel-eslint eslint-plugin-react eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-flowtype

We recognize that this is suboptimal, but it is currently required due to the way we hide the ESLint dependency. The ESLint team is already working on a solution to this so this may become unnecessary in a couple of months.

This is, of course, assuming that you’re fine with the ESLint configuration we picked for you.

Community
  • 1
  • 1
Dan Abramov
  • 264,556
  • 84
  • 409
  • 511
  • 1
    Actually Dan, it's working fine for me just installing them **locally**. Is that possible? – caesarsol Oct 04 '16 at 15:29
  • That works too, sure, if you're okay with a bunch of devDependencies. – Dan Abramov Oct 05 '16 at 12:01
  • I find it actually cleaner, and it will be version-proof. – caesarsol Oct 05 '16 at 18:07
  • I also had to install eslint-config-react-app and the docs are now at https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#displaying-lint-output-in-the-editor (Dan's link is broken) – Henry Sep 04 '18 at 04:45
  • 404. Is this the correct link? [Displaying Lint Output in the Editor](https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#displaying-lint-output-in-the-editor) – vsync Sep 07 '18 at 15:57
  • Hi, is this still the state of the art? Thanks for any help – gabssnake May 23 '19 at 14:46