15

I have a folder with two projects, a Nodejs backend and a Vuejs frontend. I want to open both projects at the same time, and being able to use eslint to check and format code in both.

The problem I'm having is that whenever a get the configuration sort of working for the vue project, the js files in the backend are not validated.

My main question is if it is possible at all to do this or not. I've already followed countless tutorials on getting eslint+prettier+airbnb plus all of the relevant plugins working. Else, if is it better to open two instances of VSCode, one for the backend and another for the frontend, each with its own configuration.

Thanks !!!

DToffe
  • 151
  • 1
  • 1
  • 5
  • I forgot to mention that I have installed the Vetur and Eslint VSCode extensions, in case this makes any difference. – DToffe Feb 11 '20 at 22:27
  • you can set your environment in eslint by adding `/* eslint-env node */` to your files or creating separate `.eslintrc` files in each directory https://eslint.org/docs/user-guide/configuring#specifying-environments – nntrn Feb 12 '20 at 04:21

2 Answers2

31

Yes, you can get this working. You'll need to update your workspace settings.

https://medium.com/devityoself/monorepo-eslint-vscode-6f5982c8404d

[From Visual Studio Code]:

  1. CMD + Shift + P
  2. Start to type Workspace settings
  3. Search for ESlint extension and look for Working Directories and select Edit in settings.json.
  4. Enter the paths that need ESlint enabled
{ "eslint.workingDirectories": ["mobile/iOS", "platform/web"] }
stealththeninja
  • 3,576
  • 1
  • 26
  • 44
loyalBrown
  • 1,416
  • 16
  • 23
  • 2
    Thanks, this worked like a charm. Please, note the selection of `Workspace settings`, not the global ones, when looking for eslint config option – Dmytro Oct 14 '20 at 18:16
  • 5
    You need to provide the answer here instead of just a link. Links can sometimes point to a 404. – JoeMoe1984 Oct 21 '20 at 22:04
  • Another option is to use [{"mode": "auto"}]. It will auto-detect the workspace based on file location. – Greg Aug 14 '23 at 22:04
9

For me, this was an issue with the VS Code ESLint extension when you have the app in a subfolder from the root. To solve it, I created a .vscode folder in the root with a file settings.json and this contents

{
  "eslint.workingDirectories": ["./app", "./another-app"]
}

This only works this way if you're using the VS Code "workspace" where you've started with an empty workspace and added directories to the workspace, so it's not a directory itself.

If you've loaded the parent folder using Code ~/parent-folder with a lot of subfolders for projects, and then you've got two folders inside those folders, you'll need to create the .vscode/settings.json in your parent folder, but then add in the folder path to the start, so

{
  "eslint.workingDirectories": ["./subfolder/app", "./subfolder/another-app"]
}
Sam Benskin
  • 91
  • 1
  • 2