Tips for fixing prettier errors in express and TypeScript code

I have set up a simple Node/Express + Typescript application

app.listen(PORT, (): void => {
  console.log(`app is running in ${environment} and listening on port ${PORT}!`);
});

I am encountering an error and I am unsure of the cause?

Replace PORT, with ⏎··PORT,⏎· (prettier/prettier)

Insert ·· (prettier/prettier)

Replace } with ··},⏎ (prettier/prettier)

Attempting to resolve these errors displayed in Codacy dashboard triggers ESLint errors in Vscode. I am uncertain how to disable them as Codacy might be reading it from the eslintrc file. Here is my eslintrc configuration:

module.exports = {
  parser: '@typescript-eslint/parser',
  extends: [
    'plugin:@typescript-eslint/recommended', 
    'prettier/@typescript-eslint', 
    'plugin:prettier/recommended', 
  ],
  parserOptions: {
    ecmaVersion: 2018, 
    sourceType: 'module', 
  },
  rules: {
    '@typescript-eslint/no-unused-vars': 'error',
    'array-callback-return': 'error',
    // "no-console": "error",

    // these we probably do not care about
    '@typescript-eslint/array-type': 'off',
    '@typescript-eslint/explicit-member-accessibility': 'off',
    '@typescript-eslint/explicit-function-return-type': 'off',
    '@typescript-eslint/no-explicit-any': 'off',
  },
};

Any suggestions or insights?

Answer №1

Encountered a similar issue and successfully resolved it.

The root cause was discovered to be an outdated version of Prettier installed locally, while Codacy was utilizing the most recent version. This mismatch led to discrepancies where errors were visible on Codacy after code submission, but not detected in my local environment.

To rectify the situation, I updated my local Prettier installation and restarted VSCode for the changes to take effect. Subsequently, the problem was effectively addressed.

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

I am looking to integrate a custom button that, when clicked, will launch the file explorer for me to choose a file. Once selected, the file name should automatically populate in the input field

In the code below, when the button is clicked, Windows Explorer should open and allow the user to select a file. The selected file should then be displayed in the input field. The file type should not be 'File'. <Grid.Column width={8}> ...

Making changes to HTML on a webpage using jQuery's AJAX with synchronous requests

Seeking assistance to resolve an issue, I am currently stuck and have invested a significant amount of time. The situation at hand involves submitting a form using the traditional post method. However, prior to submitting the form, I am utilizing the jQue ...

What is the best method to erase data from an AutoComplete Box when clicking?

I have incorporated the Material UI AutoComplete component which can be found here. Below is my code snippet: <Autocomplete open={showUniSuggs} onOpen={this.props.getUniversityOptions} onChange={(event, value) => this.props.handleUniversi ...

What did I overlook in my AJAX implementation?

When a user selects a value from the dropdown menu, an Ajax call must be made to the server to retrieve some values in JSON format. Below is the Ajax code //AJAX Security $('#ddlSecurityLevel').change(function () { if ($('#ddlSecurityL ...

Button for Toggling Audio Play and Pause

Is it possible to create an SVG image that changes color slightly when hovered over, and when clicked toggles to another SVG image that can be switched back to the original by clicking again with the same hover effect? Additionally, when clicked, it should ...

I'm currently troubleshooting the code for the Gallery project. The gallery is supposed to have 4x4 grids, but for some reason, the grids are

It seems like I am struggling to identify the exact issue. The display on mobile looks fine but not on desktop. I attempted to tweak the isotope configuration without success. Even manipulating the server-side code didn't reveal any obvious problems. ...

The functionality of Object.assign in REACT is producing unexpected and incorrect results

Hey everyone, I have a project in React with 3 components. My goal is to extract the state from these 3 components and combine them into one JSON object on a final page. The components are not nested as child and parent, so my workaround was to set the st ...

Using Jasmine to simulate multiple method calls in a testing environment

Currently, I am working on writing a JavaScript test for a method that involves making two function calls (model.expandChildren() and view.update();). // within the 'app' / 'RV.graph' var expandChildren = function(){ return model.e ...

JavaScript client receives a response from the server

After filling out an HTML form and submitting it, the client validates the data (such as checking if the EULA checkbox is accepted) before sending it to the server. The server then checks the data and returns a status code. But how can I retrieve this stat ...

Converting JSON object to a string

I have an object that contains the value "error" that I need to extract. [{"name":"Whats up","error":"Your name required!"}] The inspector displays the object in this format: [Object] 0: Object error: "Your name required!" name ...

Unable to locate module within a subdirectory in typescript

The issue I'm facing involves the module arrayGenerator.ts which is located in a subfolder. It works perfectly fine with other modules like Array.ts in the parent folder. However, when I introduced a new module called Sorting.ts, it started giving me ...

What is the best way to combine data from two rows into one row?

Can someone help me with merging 2 sets of Line data into a single row for each entry? For example, the 'Green Bay Packers @ Chicago Bears' row should display '+3.5000 and -3.5000', while 'Atlanta @ Minnesota' should show &apo ...

Enhance autocomplete functionality by adding an additional parameter specific to Zend Framework

My form includes two fields: country club The club field is generated using the ZendX_JQuery_Form_Element_AutoComplete Element, which also creates this javascript code: $("#club").autocomplete({"url":"\/mywebsite\/\/mycontroller\/au ...

Is it possible to retrieve a variable from code.gs and pass it to my html file?

I had originally set up an automated email system to trigger once a certain condition was met, which I successfully implemented. However, I now want to enhance the email by including a more structured format and embedding an image from Google Drive. While ...

Unable to update date field using .updateMany() method in mongoose

Recently, I made changes to my app's password system. After updating the password successfully with nModified: 1, I noticed that the date field does not update as expected. How can I ensure that this date field gets updated along with the password cha ...

Is it possible for me to reconstruct the "reducer" each time the useReducer hook is rendered?

Here is an example taken from: https://reactjs.org/docs/hooks-reference.html#usereducer const initialState = {count: 0}; function reducer(state, action) { switch (action.type) { case 'increment': return {count: state.count + 1}; ...

How to eliminate file nesting in Visual Studio 2017

Is there a way to prevent certain file types from being nested within other files, such as .ts files not being nested beneath .html files? I came across this request, but has anyone found a solution to achieve this? ...

Tips for implementing FontAwesome in Nuxt3

I'm facing some issues trying to implement FontAwesome in my NuxtJS project, and for some unknown reasons, it's not working as expected. Let's take a look at my package.json: { "private": true, "scripts": { " ...

Checking the match between password and confirm password using Mongoose schema

My current userSchema is structured as follows: var userSchema = new Schema({ name: { type: String , required: true , validate: [validators.notEmpty, 'Name is empty'] } , username: { type: String , required: tru ...

Tips for attaching the Bootstrap 5 dropdown menu to a particular element, especially when the dropdown element is contained within another element that has an overflow property set to hidden

I am utilizing the Bootstrap 5 dropdown menu within an owl-carousel. However, the dropdown is getting clipped because the outer div has an 'overflow:hidden' style in the owl-carousel. https://i.sstatic.net/YD9l2.jpg For the complete code snippe ...