How to extend bud-react eslint config?

bud
, ,
1

I’m building a site that uses the latest version of Sage 10, the site also uses react so I’ve added @roots/bud-react and I’m attempting to setup my eslint config so that it extends bud-react. Everything seems to be working until I try to save a js file and I get the following error:

Failed to load config “@roots/bud-babel” to extend from.

Referenced from: /…root-to-theme…/node_modules/@roots/bud-react/eslint-config/index.js

My .eslintrc.js :

{
  root: true,
  extends: [require.resolve('@roots/bud-react/eslint-config')],
}
2

Sage’s config includes @roots/bud-react out-of-the-box.

`@roots/eslint-config/sage` -> `@roots/eslint-config/wordpress` -> `@roots/eslint-config/react`.

All of Roots’ eslint configurations have been moved to @roots/eslint-config. You do need to import it as of the current Sage release (it does not ship with Sage).

Here is a config with a couple react rules enabled:

module.exports = {
  root: true,
  extends: ['@roots/eslint-config/sage'],
  rules: {
    'react/jsx-uses-react': 'error',
    'react/jsx-uses-vars': 'error',
  },
};
2 Likes
3

Updating my config to match yours and adding eslint-config fixed the issue, thanks!