Steps to remove the trailing comma automatically inserted after adding a decorator in vscode with the help of prettier

Take a look at my code snippet:

import { ApiController, Controller } from "./lib/rest";

[Controller("test")];
export class TestController extends ApiController {}

Interestingly enough, vscode keeps inserting a trailing comma after the decorator.

[Controller("test")];

I've been struggling to find a way to stop this behavior specifically for decorators.

If anyone could offer some guidance on this issue, I would greatly appreciate it.

Answer №1

If you're facing an issue with trailing commas, there's a workaround that can help. Instead of using prettier, try installing the "beautify" extension to address this problem.

https://marketplace.visualstudio.com/items?itemName=HookyQR.beautify

If you prefer to continue using prettier, navigate to vscode and follow these steps:

File > Preferences > Settings > User Settings

"prettier.trailingComma": "none" or update it to "prettier.trailingComma": "es5"

This should hopefully resolve your issue.

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

Tips for integrating ng2-file-uploader with WebStorm version 2016.1

I am implementing the ng2-file-uploader in my application. I have referred to this Github project but encountered an error. Note: I am new to Angular2 development. Using the latest version of webstorm (2016.1) and Typescript 1.8.2 ERROR in ./~/ng2-file-u ...

Transforming encoded information into a text format and then reversing the process

I am facing an issue with storing encrypted data in a string format. I have tried using the TextEncoder method but it seems to be creating strings with different bytes compared to the original ArrayBuffer. Here is the line causing the problem: const str ...

Angular 4: Implementing Subscription with Behavior Subject

I am currently working with Angular 4 and utilizing observables. I have a requirement to share data between components as I am using BehaviorSubject along with observables. Below is the code snippet: import { Subject } from 'rxjs/Subject'; imp ...

Angular 6: Issue TS2339 - The attribute 'value' is not recognized on the 'HTMLElement' type

I have a textarea on my website that allows users to submit comments. I want to automatically capture the date and time when the comment is submitted, and then save it in a JSON format along with the added comment: After a comment is submitted, I would li ...

How can we associate conditional types with a union type on a map?

Attempting to implement the following structure, encountered an error involving the return type of the function and a conditional type not being assignable to the union: type RequestType = | 'foo' | 'bar' | 'baz' inter ...

How can I effectively link data to an Angular Material dropdown in Angular 5?

Essentially, I am updating a user profile with user information that needs to be bound to the corresponding fields. this.editOfferprice= new FormGroup({ xyz : new FormControl(xxxx,[]), xxx: new FormControl(xxxx,[Validators.required]), ...

Divide the string into several segments according to its position value

Here is a piece of text that I would like to divide into multiple sections, determined by the offset and length. If you have any questions or comments and would like to get in touch with ABC, please go to our customer support page. Below is a function ...

Tips on resolving the error message "this.accountService is not defined"

I am new to Angular and JHipster and need help solving a problem. I have not made any changes to the code, it is still using JHipster's default code for login. Stack trace: TypeError: this.accountService is undefined Stack trace: LoginService.protot ...

Tips on transferring key values when inputText changes in ReactJs using TypeScript

I have implemented a switch case for comparing object keys with strings in the following code snippet: import { TextField, Button } from "@material-ui/core"; import React, { Component, ReactNode } from "react"; import classes from "./Contact.module.scss" ...

Is there a way to efficiently compare multiple arrays in Typescript and Angular?

I am faced with a scenario where I have 4 separate arrays and need to identify if any item appears in more than two of the arrays. If this is the case, I must delete the duplicate items from all arrays except one based on a specific property. let arrayA = ...

nodemon keeps attempting to restart the server after making changes to files, but the updates are not being reflected

I've been using the nodemon package, but I'm experiencing issues with it not restarting the server properly. Instead of showing "server running" after making changes like in tutorials, all it displays is "restarting due to changes". This also res ...

Utilizing Typescript for Promises and leveraging Async-Await for dependent calls

I am currently exploring ways to enhance the performance of data loading by running requests in parallel or considering alternative methods. My background is in Java and I am relatively new to coding in Javascript/Typescript. I recently came across Async-A ...

Modifying the data type returned by Array.prototype.reduce方法

Within my array of objects containing CustomObjects, each object contains a field called stringArray populated with an array of strings. I am attempting to merge all the string arrays together using the following code: const testArray = arrayOfObjects.red ...

What is the best way to confirm the validity of CSS, Less, or Sass within Visual Studio Code?

Despite the instructions in Visual Studio Code documentation stating that propertyIgnoredDueToDisplay should trigger a default "warning," it does not seem to be working in my CSS file when using the following rule: blockquote cite { display: inline; ...

One typical approach in React/JavaScript for monitoring the runtime of every function within a program

Experimenting with different techniques such as performance.now() or new Date().getTime() has been done in order to monitor the processing time of every function/method. However, specifying these methods within each function for time calculation purposes h ...

Tips for setting a default value for the local file in React Native

I am attempting to assign a default value to my Avatar component in React Native Elements as I do not have all the required icon files prepared. However, when I use the OR logic, it does not seem to work as expected. What is the correct approach to achie ...

Struggling with setting up a search bar for infinite scrolling content

After dedicating a significant amount of time to solving the puzzle of integrating infinite scroll with a search bar in Angular, I encountered an issue. I am currently using Angular 9 and ngx-infinite-scroll for achieving infinity scrolling functionality. ...

Best practices for defining rest parameters within a named parameters class that extends a constructor in Typescript

I created a class with several parameters that are initialized in the constructor, and then I have another class that extends this one. Here is an example with simplified parameters: class MyClass { name?: string; day?: Date; constructor({ name, ...

Executing Lambda invocations concurrently can result in an empty payload being returned

To ensure the effectiveness of my lambdas, I constructed a series of canaries for testing purposes. These canaries follow a fat-lambda approach for simplicity, utilizing a single parameter to indicate which canary should be triggered. const { isLambda } = ...

Angular HTML fails to update correctly after changes in input data occur

Within my angular application, there is an asset creator component designed for creating, displaying, and editing THREE.js 3D models. The goal was to implement a tree-view list to showcase the nested groups of meshes that constitute the selected model, alo ...