I have monorepository managed by rush (https://rushjs.io/)
The structure of code is:
As you see, there are two eslint configs and two directories node_modules
(it is just symlink created by rush).
Eslint to back work perfectly.
But I have some troubles with eslint config to front. When I run it with
yarn eslint --ext .js --ext .jsx ./src
from directory front
, it work.
But it doesn't work, when eslint has launched from vscode. In output I see:
Consider running eslint --debug /Users/oleg/Desktop/projects/hire/front/src/pages/config.js from a terminal to obtain a trace about the configuration files used.
[Error - 2:04:08 PM]
Failed to load plugin 'react' declared in 'front/.eslintrc': Cannot find module 'eslint-plugin-react'
Require stack:
- /Users/oleg/Desktop/projects/hire/__placeholder__.js
Referenced from: /Users/oleg/Desktop/projects/hire/front/.eslintrc
Happened while validating /Users/oleg/Desktop/projects/hire/front/src/pages/config.js
This can happen for a couple of reasons:
1. The plugin name is spelled incorrectly in an ESLint configuration file (e.g. .eslintrc).
2. If ESLint is installed globally, then make sure 'eslint-plugin-react' is installed globally as well.
3. If ESLint is installed locally, then 'eslint-plugin-react' isn't installed correctly.
eslint-plugin-react
is already installed and defined in front/package.json
Do you have any idea, why eslint can't work?
P.S Eslint config:
{
"parser": "babel-eslint",
"extends": [
"airbnb",
"plugin:react/recommended"
],
"env": {
"browser": true,
"node": true,
"jest": true,
"es6": true
},
"plugins": [
"react",
"jsx-a11y"
],
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
}
},
"rules": {
"newline-before-return": "error",
"newline-after-var": "error",
"arrow-parens": [
"error",
"always"
],
"arrow-body-style": [
2,
"as-needed"
],
"comma-dangle": [
2,
"always-multiline"
],
"import/imports-first": 0,
"import/newline-after-import": 0,
"import/no-extraneous-dependencies": 0,
"import/no-named-as-default": 0,
"import/no-unresolved": 2,
"import/prefer-default-export": 0,
"indent": [
2,
2,
{
"SwitchCase": 1
}
],
"max-len": 0,
"newline-per-chained-call": 0,
"no-confusing-arrow": 0,
"no-console": 1,
"no-use-before-define": 0,
"prefer-template": 2,
"class-methods-use-this": 0,
"react/forbid-prop-types": 0,
"react/jsx-first-prop-new-line": [
2,
"multiline"
],
"react/jsx-no-target-blank": 0,
"react/require-extension": 0,
"react/self-closing-comp": 0,
"react/display-name": 0,
"require-yield": 0,
"import/no-webpack-loader-syntax": 0,
"react/prop-types": [
0
]
},
"settings": {
"babel-plugin-root-import": {
"rootPathPrefix": "~/",
"rootPathSuffix": "src/"
},
"import/resolver": {
"webpack": {
"config": "./webpack/webpack.prod.js"
}
}
},
"globals": {
"CONFIG": true
}
}
Configure VSCode Settings to use ESLint for Formatting Click that tiny icon in the top-right that looks like a piece of paper with a little arrow. The first one turns on ESLint for formatting, and the next 3 make it do the formatting when you hit save. That should do it! Save the settings file and close it, we're done.
Add to workspace settings:
{
"eslint.workingDirectories": [
"back",
"front"
]
}
and potentially:
{
"eslint.workingDirectories": [
{
"directory": "front",
"changeProcessCWD": true
}
]
}
The problem is with where vscode/eslint looks for dependencies.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With