Stack Overflow
Stack Overflow

Questions tagged [prettier]

Prettier is an opinionated code formatter for JavaScript, CSS, HTML, Markdown, and other languages. If possible, please use Prettier's Playground to illustrate your question (use the "Copy link" and "Copy markdown" buttons at the bottom right corner of the Playground).

Prettier is an opinionated code formatter.

You can use it to format JavaScript (including JSX, Flow, TypeScript, JSON), CSS (including Less, SCSS, CSS-in-JS), HTML (including Angular and Vue), GraphQL, Markdown, and YAML.

Try it out here: Prettier Playground.

1619 questions
68
votes
6 answers

Disable prettier for a single file

I need to disable prettier for a single file (API URLs file) in my project in Vs-code. actually, I need each API and its URL to be in one line, but prettier breaks them in two lines. before export const GET_SEARCH_TEACHERS = params =>…
Hamid Shoja
  • 3,838
  • 4
  • 30
  • 45
62
votes
27 answers

Prettier not formatting HTML files in VS Code

Prettier extension on my VS code is unable to format HTML. On load of VS code I am getting this error in my console - On trying to format, I see this message in the bottom - Note - TS files and SCSS files are being formatted properly. It is…
Nithin Kumar Biliya
  • 2,763
  • 3
  • 34
  • 54
62
votes
4 answers

Is there a config in prettier to keep line breaks?

have a problem with prettier extension in VS Code, When I write this: const result = await pool .request() .query('select NumberPlate, ID, TimeStamp from RESULTS order by ID'); and save the file, it turns into a single line like…
juan ocho
  • 823
  • 1
  • 7
  • 13
61
votes
2 answers

Is there a way to list all active ESLint / Prettier rules in an Angular project?

Background: I'm trying to config ESLint and Prettier using .eslintrc.js and .prettierrc.js by starting with some extends…
Holly
  • 1,305
  • 2
  • 15
  • 30
59
votes
13 answers

Prettier and eslint indents not working together

I traying setup my vim based typescript developing environment, but have an issue with indent management. Probably 'eslint' says: indent: Expected indentation of 2 spaces but found 4. after prettier reformat. My .eslintrc.js: module.exports = { …
Edgaras Karka
  • 7,400
  • 15
  • 61
  • 115
57
votes
13 answers

How do I stop prettier from formatting HTML files?

So the problem is that prettier does not format html very well. for instance if I have this angular template:
Rachid O
  • 13,013
  • 15
  • 66
  • 92
56
votes
3 answers

How to disable prettier settings creating new line of > of html tag?

I walk through the Prettier extension of Vscode and I can't find how to disable this scenario. See the > of html tag. Here's a sample code that needed some fix, every time i run the Prettier. The output is this:
rosiejaneenomar
  • 882
  • 1
  • 10
  • 17
55
votes
9 answers

Unable to set tab width to 4 in prettier

I installed prettier extension for vscode and configured tab width as 4 spaces but it still indents new lines with 2 spaces. Anything I am doing wrong? Here is the gif showing when I format the file: EDIT: Contents of .prettierrc file: { …
javanoob
  • 6,070
  • 16
  • 65
  • 88
53
votes
8 answers

prettier settings for vscode

I recently switched to a new computer, and am having difficulty with a prettier setting. (I think it's prettier, could be eslint). This gif illustrates what's happening: http://g.recordit.co/H871hfT9Sv.gif Anyone know what this setting is called? I…
0xPingo
  • 2,047
  • 4
  • 19
  • 43
52
votes
13 answers

In VS Code, I'm getting this error, 'Failed to load module. Attempted to load prettier from package.json'

When I'm using VS Code and open up a project, I get this notification in the bottom right corner: Failed to load module. If you have prettier or plugins referenced in package.json, ensure you have runnpm installAttempted to load prettier from…
ghostagent151
  • 1,218
  • 2
  • 16
  • 33
52
votes
6 answers

How to fix 'Static HTML elements with event handlers require a role.'?

My reactjs styledcomponent contains this code: this.gotoLink()}> This works fine but the eslint is complaining: Static HTML elements with event handlers require a role. How can I fix this…
bier hier
  • 20,970
  • 42
  • 97
  • 166
52
votes
5 answers

Prettier + Airbnb's ESLint config

Recently, I've started using Visual Studio Code for my editor and found the Prettier - JavaScript formatter. I think it's a great plugin because it helps me keep my code looking nice. I set up Airbnb's ESLint config and have found that to be super…
Jiovan Melendez
  • 719
  • 1
  • 6
  • 8
48
votes
9 answers

Prettier is not indenting as specified

Prettier continues to format my code incorrectly. I desire 4 spaces for tabs (second picture) but it ignores the editor settings and does 2 (first picture). I know it is prettier causing this because when I disable it vs code correctly indents for…
imnickvaughn
  • 2,774
  • 9
  • 25
  • 42
42
votes
5 answers

Eslint adds unnecessary space between braces, Prettier shows error

I'm using prettier and eslint with typescript. When I write some code and have to leave an empty function for reasons, Eslint and Prettier struggle adding and removing spaces between the empty function's braces. Prettier is removing the space while…
Angelo Dias
  • 1,125
  • 4
  • 13
  • 23
42
votes
7 answers

Closing > in new line

I have problem with '>' in tags. I got: How to make label starting tag '>' in the same line as last attribute? I use…
Mieszczańczyk S.
  • 857
  • 1
  • 9
  • 16
1
2
3
…
99 100