Eslint in VS Code encounters issues resolving paths within a monorepo

I'm currently working on a project with the following structure:

modules
│   ├── client
│       ├── .eslintrc.json
│   └── backend
│       ├── .eslintrc.json
...

One issue I've run into is that when I access the project from the parent folder of modules (the root folder), the Eslint instance inside VS Code cannot resolve import paths, except for those pointing to node_modules. However, if I run Eslint within the client folder, it resolves the paths without any issues.

I learned that in Javascript Eslint configuration, you can use __dirname to address this problem. Unfortunately, this feature is not available in JSON files. Is there an alternative method to achieve the same outcome in JSON, or do I need to convert my configurations to javascript?

Thank you for your help.

javascriptjsontypescripteslint

Answer №1

My solution involved utilizing the eslint.workingDirectories configuration option.

Instead of listing each directory individually, I opted to utilize the pattern parameter like so:

"eslint.workingDirectories": [
  { "pattern": "./components/*/" }
]

Answer №2

Upon further investigation of the documentation, it appears highly likely that utilizing .eslintrc.js is necessary instead of .json.

Answer №3

When using VS Code, there may be issues with determining the folders where ESLint should run.

To resolve this problem, navigate to your VS Code Settings (CMD + , on Mac), go to Workspace settings, and locate eslint.workingDirectories. Set it to: 

[{ "mode": "auto" }]
.

While this method works, there are some drawbacks to consider. Alternatively, you can explore more solutions here: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint#settings-options

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Passing JSON data from JQuery to a Spring MVC controller

I am facing an issue with sending a JSON object using JQuery Ajax to a Spring MVC controller. Here is the method definition of my controller: @Controller @RequestMapping(value = "InboxViewTemplate") public class InboxViewController { @ResponseBody @R ...

jqueryajaxjsonspringmodel-view-controller

Issues with JQuery .on() occur when functions are passed as arguments

There seems to be a difference in how the .on() function behaves when passing functions as parameters. Interestingly, defining the function inside the parameters versus passing it separately can have different results. An example of this discrepancy is de ...

javascriptjquery

jQuery sidebar with a fixed position

Is there a way to implement a sidebar menu feature using jQuery that reappears on the left as the user scrolls down the page? You can see an example sidebar menu here. ...

javascriptjqueryhtmlcss

Transforming a MySQL list of values into an array using square brackets

I am looking to use ApexCharts to display a chart based on data retrieved from MySQL. I have set up a connection to my database using axios and a php file containing functions to interact with the database. Here is an example of a typical vue method: myfun ...

phpmysqljsonvue.jsaxios

Tips for eliminating a single occurrence with Array.prototype.filter()

I am facing an issue in my React app with the deleteNumberFromList method. This function is designed to remove a specific number from the array by utilizing a setter hook: const [valuesList, setValuesList] = useState<number[]>([]); const deleteNumbe ...

reactjstypescriptreact-hooks

What is the best way to extract information from a JSON file?

Hello all, I'm facing an issue while trying to parse a JSON object in Angular. I've created a JSON object with all the necessary data in my service. In the component, I am attempting to parse this JSON and display all messages in youSend.mess ...

jsonangularparsing

What is the best way to manage a session using JavaScript?

Currently developing a website that initially hides all elements except for the password box upon loading. Once the user enters the correct password, all webpage elements are revealed. Seeking a solution to keep the elements visible on reload by utilizing ...

javascriptphphtmlcookiessession-cookies

Unable to allocate a second item to an existing one

Encountering an unusual issue while trying to assign an item a second time. Initial scenario: I am working with a jqxTree containing various items as shown below: - apple - oracle - microsoft When I drag and drop one item into another, the structure loo ...

javascriptjqueryjqxwidgets

Error in Redux reducer file caused by an incorrect data type in action.payload

I have encountered a type error in my reducers' file where it says that my 'Property 'address' does not exist on type 'number | { connection: boolean; address: string; }'. This issue is arising in my React application while us ...

javascriptreactjstypescriptreduxreact-redux

Is there an equivalent of getElementById for placeholder text?

I need help automating the input of information on a webpage using JavaScript. Each field has a unique ID, like this: <div id="cc-container" class="field has-float-label"> <input placeholder="ccnumber" id="credit_card_number" maxlength="16" ...

javascripthtml

Starting jQuery on embedded websites

I developed a platform that relies on JavaScript. Users of my platform are required to paste a code similar to Google Analytics, which automatically deploys a custom set of JavaScript functions along with the latest jQuery 1.9 through Google. The issue I ...

javascriptjquery

What are some strategies for exporting methods without resorting to the use of import * as ...?

Imagine having a file structured like this: // HelperFunctions.ts export const dateFormat = 'MM/DD/YYYY'; export const isEmpty = (input: string | null | undefined): boolean => { if (input == null) { return true; } if (!in ...

javascripttypescriptes6-modules

Switch between different tables

I need assistance with implementing a functionality where there are two tables displaying different data and two buttons at the top of the page. Upon clicking one button, I want Table A to be displayed, while clicking on the other button will hide Table ...

javascripthtmltoggle

Vue transition unexpectedly ending in the wrong position due to nested transitions

I've encountered an issue while trying to implement a transition on a child div within a 'parent' div that already has its own transition. It seems like the child transition is conflicting with the parent transition, causing it to end up in ...

javascriptvue.jsvuejs2

What is the best way to transmit a variable name along with its value to the server, and then successfully obtain a computed response in

I am a beginner in the world of Wordpress and plugins, but I have a decent understanding of PHP, JavaScript, and HTML. Recently, I created a plugin for Wordpress that generates a page (form) to gather information about product specifications. Although it c ...

javascriptphpwordpressserver

Tips for retrieving spinner values and displaying them in a textview

After receiving a JSON response in an alert dialog spinner, I am now trying to display the user-selected items in an EditText with commas separating them. However, when I run the app, I can only select and display one item in the EditText. public class M ...

androidjsonandroid-alertdialog

Save React code as a single HTML file

My current project involves creating one-page websites for a specific service that only accepts single inline HTML files. To make these webpages as modular as possible, I am utilizing React to create ready components. The challenge is exporting the final R ...

javascripthtmlreactjswebpacknext.js

socket.io / settings when establishing a connection

I'm facing an issue in my node.js / Express.js app where I need to pass parameters with the socket.io connection (saw a solution in another post). On the client side, here is a snippet of my code: edit var socket = io.connect('/image/change&ap ...

javascriptnode.jsexpresssocket.io

Utilizing variables in GraphQL requests

UPDATE: see the working code below GraphiQL Query I have this query for retrieving a gatsby-image: query getImages($fileName: String) { landscape: file(relativePath: {eq: $fileName}) { childImageSharp { fluid(maxWidth: 1000) { base64 ...

javascriptreactjsgraphqlgatsby

Enhancing data entry by using a dropdown menu to update the record value without adding any undefined data elements

Currently, I am working on enhancing a Location edit form that includes an API-fed dropdown list of Departments. The task involves utilizing the record's departmentId to preselect the current value in the dropdown menu. However, a complication arises ...

javascriptreactjsaxiosmaterial-ui