How to configure Yarn Berry, Eslint with GlobalCache in VsCode? - visual-studio-code

Question

Is there a way to install EsLint with Yarn Berry with yarn option enableGlobalCache: true in VsCode ?
I installed the ESLint (dbaeumer.vscode-eslint) extension and all dependencies :
"devDependencies": {
"#babel/core": ">=7.12.0 <8.0.0",
"#babel/plugin-proposal-class-properties": ">=7.10.4 <8.0.0",
"#babel/plugin-syntax-dynamic-import": ">=7.8.3 <8.0.0",
"#babel/plugin-transform-runtime": ">=7.12.0 <8.0.0",
"#babel/preset-env": ">=7.12.0 <8.0.0",
"#babel/preset-react": ">=7.10.4 <8.0.0",
"#babel/runtime": ">=7.12.0 <8.0.0",
"babel-eslint": ">=10.1.0",
"babel-loader": ">=8.1.0",
"eslint": "^7.12.1",
"eslint-config-airbnb": "^18.2.0",
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-jsx-a11y": "^6.4.1",
"eslint-plugin-react": "^7.21.5",
"eslint-plugin-react-hooks": "^4.2.0",
"file-loader": ">=6.1.0",
"terser-webpack-plugin": ">=4.1.0",
"webpack": ">=5.2.0",
"webpack-cli": ">=4.1.0"
}
If I do a yarn eslint --init and let npm install all node_modules, eslint works but yarn up will erase node_modules and I have to reinstall the modules.
If I don't install the modules :
Error: An error occurred while generating your JavaScript config file. A config file was still generated, but the config file itself may not follow your linting rules.
Error: Cannot read config file: C:\FrontApplication\Abc\Main\Source\myProject\.yarn\$$virtual\eslint-config-airbnb-virtual-094ee35fd8\6\Users\someone\AppData\Local\Yarn\Berry\cache\eslint-config-airbnb-npm-18.2.0-898fc49dc6-6.zip\node_modules\eslint-config-airbnb\index.js
Error: Cannot find module 'C:\Projets\Abc\Main\Source\myProject\.yarn\$$virtual\eslint-config-airbnb-virtual-094ee35fd8\6\Users\someone\AppData\Local\Yarn\Berry\cache\eslint-config-airbnb-npm-18.2.0-898fc49dc6-6.zip\node_modules\eslint-config-airbnb\index.js'
Require stack:
- C:\Users\someone\AppData\Local\Yarn\Berry\cache\#eslint-eslintrc-npm-0.2.1-88318143fb-6.zip\node_modules\#eslint\eslintrc\lib\noop.js
Require stack:
- C:\Users\someone\AppData\Local\Yarn\Berry\cache\#eslint-eslintrc-npm-0.2.1-88318143fb-6.zip\node_modules\#eslint\eslintrc\lib\noop.js
Referenced from: BaseConfig
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15)
at Function.external_module_.Module._resolveFilename (C:\FrontApplication\Abc\Main\Source\myProject\.pnp.js:10974:54)
at resolveFileName (C:\Users\someone\AppData\Local\Yarn\Berry\cache\resolve-from-npm-4.0.0-f758ec21bf-6.zip\node_modules\resolve-from\index.js:29:39)
at resolveFrom (C:\Users\someone\AppData\Local\Yarn\Berry\cache\resolve-from-npm-4.0.0-f758ec21bf-6.zip\node_modules\resolve-from\index.js:43:9)
at module.exports (C:\Users\someone\AppData\Local\Yarn\Berry\cache\resolve-from-npm-4.0.0-f758ec21bf-6.zip\node_modules\resolve-from\index.js:46:41)
at module.exports (C:\Users\someone\AppData\Local\Yarn\Berry\cache\import-fresh-npm-3.2.1-b4f6711244-6.zip\node_modules\import-fresh\index.js:13:19)
at loadJSConfigFile (C:\Users\someone\AppData\Local\Yarn\Berry\cache\#eslint-eslintrc-npm-0.2.1-88318143fb-6.zip\node_modules\#eslint\eslintrc\lib\config-array-factory.js:225:16)
at loAbconfigFile (C:\Users\someone\AppData\Local\Yarn\Berry\cache\#eslint-eslintrc-npm-0.2.1-88318143fb-6.zip\node_modules\#eslint\eslintrc\lib\config-array-factory.js:308:20)
at ConfigArrayFactory._loAbconfigData (C:\Users\someone\AppData\Local\Yarn\Berry\cache\#eslint-eslintrc-npm-0.2.1-88318143fb-6.zip\node_modules\#eslint\eslintrc\lib\config-array-factory.js:608:42)
at ConfigArrayFactory._loadExtendedShareableConfig (C:\Users\someone\AppData\Local\Yarn\Berry\cache\#eslint-eslintrc-npm-0.2.1-88318143fb-6.zip\node_modules\#eslint\eslintrc\lib\config-array-factory.js:883:21)

Answer 1

Do not install packages individually
use : yarn dlx #yarnpkg/sdks vscode
https://yarnpkg.com/getting-started/editor-sdks
Global cache works fine afterwards