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).

Filter by
Sorted by
Tagged with
-1 votes
0 answers
5 views

Formatter not formating on save in VSC

When I save (ctrl+s) the changes on file, normaly Prettier its shot on save, to format the code. But now I get this error, it starts 'loading something', and after a while doesn't make effect. When I ...
0 votes
0 answers
14 views

Inconsistency with Prettier on local vs prod on the same Browser

Problem: There seems to be a mismatch in how the prettier parser performs in my local environment vs Production environment when I host my React application. The issue is particularly for the "in&...
0 votes
0 answers
13 views

Prettier throwing unexpected errors when folders/files are specified in the .prettierignore file

My goal is very simple, ignore some folders and files. Upon searching, I saw that Prettier supports .prettierignore file and you can specify the folders and files you want ignored. (see Ignoring Files:...
  • 117
0 votes
0 answers
7 views

Prettier (Extension) inserts {" "} when formatting document

I have been using Prettier extension for some time with Angular projects and decided to give it a try for one of my React projects. However what I have noticed, upon formatting my .tsx files it ...
  • 2,571
0 votes
0 answers
8 views

VS Code Prettier On-Save not replacing whitespace with {" "}

I recently did a clean install with vs code. My previous install still had prettier extension as opposed to the now built-in prettier formatter. When I loaded my project, I noticed on-save is not ...
  • 1,777
0 votes
1 answer
16 views

Error warning in settings for visual studio code

I've created a basic html page using visual studio code and when I've tried to do certain things like format the document using the prettier extension I get a error message to edit the settings. It ...
1 vote
0 answers
20 views

Prettier not working on VS Code (only from Command Palette)

I'm using VS Code on Windows 11, and I have installed Prettier. However, it only works from the terminal. If I execute npx Prettier --write dom.html in the terminal, it works fine. If I go to the ...
  • 11
0 votes
1 answer
35 views

Nextjs website not applying tailwindcss property

I am making a Nextjs React website. When I serve the react app and go to the localhost, the tailwindcss works fine. However, when I go to the website hosted by vercel, it does not work and the ...
0 votes
1 answer
18 views

Vetur + Prettier HTML formatter

I'm using Quasar with Vue3 and the vs code extension Vetur and Prettier to help me keep the code well formatted. I see something I don't really like and I would like to fix it in the configuration, ...
  • 3,236
-2 votes
0 answers
26 views

Why is VSCode's Prettier Extension not working for Python?

Prettier won't format my python files. Help me what to do! help me with this. I am using prettier and tried it. It worked well with javascript.
  • 21
0 votes
1 answer
26 views

How to configure indent tabs on prettier git action?

I've added a git action to prettify my code. The problem is that when it prettify, it makes 2 tabs indenation and I cant find where to config it to be 4 tabs (or any other prettier configuration). How ...
0 votes
1 answer
23 views

Issue with eslint/ eslint-config-airbnb

I'm getting this error when I try to run my linter that extends the airbnb linter (es-config-airbnb). I don't have an import/no-cycle rule here, so I'm not sure what the problem is: Error: .eslintrc....
0 votes
1 answer
25 views

Is there any way to change how prettier formats React code?

I'm trying to learn React and I'm using Prettier as my code formatter. I keep running into the problem where Prettier formats my code in a very unreadable way. For example: import ExpenseItem from './...
0 votes
0 answers
30 views

Prettier won't auto-fix longer Tailwind CSS class name stack according to print width

Isn't Prettier supposed to auto-fix longer Tailwind CSS class name stack according to print width? Next.js Project: Github, package.json, .eslintrc.js, .prettierrc.js, example line Visual Studio Code:...
  • 163
0 votes
1 answer
24 views

eslint not identifying prettier issues in jsx files

Following a tutorial on youtube, I have integrated eslint and prettier to my reactjs project. I have then defined a lint command in my package.json file. .eslintrc.json { "env": { &...
0 votes
0 answers
32 views

'react-hooks/rules-of-hooks' and 'react-hooks/exhaustive-deps' not working

I am trying to setup eslint that can provide me errors and warning in expo react native project. I added these rules but it seems like they are not working. This is how my .eslintrc.js looks like ...
  • 1
1 vote
2 answers
44 views

prettier command not working even though prettier is in devDependancies

In my package.json "devDependencies": { ... "prettier": "^2.8.4", ... } I run npm i. Then: $ prettier bash: prettier: command not found $ npx prettier -v /...
1 vote
0 answers
19 views

space-in-parens in .prettierrc

I want to have the prettier like space-in-parens from eslint. From: function foo(one, two, three){ To: function foo( one, two, three ){ I found this thread (https://github.com/prettier/prettier/...
0 votes
0 answers
9 views

Trying to migrate from tslint to eslint in angular@13. Getting lots of dependency errors

enter image description here I've tried to run "npm i" after cleaning the cache. but not working. Is there anything i'm missing? Do i need to update the version of the @angular/cdk or flex-...
0 votes
1 answer
39 views

Prettier indentation is conflicting... with itself?

So I have the infamous VS Code + Prettier + ESLint setup and it mostly works as expected. There are no conflicting rules when prettier formats on save. Running eslint --fix also works fine, without ...
  • 106
0 votes
1 answer
19 views

VS Code error with Prettier: "Invalid prettier configuration file detected... Cannot find module 'basedir=$(dirname..."

I only get this error when I run VS Code 'as Administrator'. It isn't a problem when I run it normally, but I need to be 'as Administrator' to perform my tasks. I'm currently getting errors any time I ...
  • 3,227
0 votes
0 answers
33 views

Prettier using wrong path for .prettierignore file

My file structure is as follows: project/ client/ .prettierrc .prettierignore The formatting output in VS Code looks something like this: ["INFO" - 4:31:44 PM] ...
  • 1
1 vote
0 answers
43 views

How to stop prettier from formatting strings?

Is there any way to stop prettier from formatting my strings in backticks ? I have already added "printWidth": 1000 to .prettierrc file. but it will apply this setting to all of my files and ...
-1 votes
0 answers
7 views

How to wrong format by Prettier?

Prettier format gives me this format for these kind of functions, I may did something wrong with the settings, can anyone help me to catch it and return it to the default setting. I don't like this ...
0 votes
0 answers
21 views

Prettier formatter removes spacing in code

I am using the prettier code formatter to format my typescript code and I can't for the life of me figure out how to have it allow spacing within the code. Example how I like it: groups: [ { ...
0 votes
0 answers
10 views

Different Prettier rules for viewing and saving files in VSCode

Is there a way to have differing prettier rules for when I'm looking and editing a file versus when it's saved and/or committed? Specifically, I don't like the visual style that we have set in our ....
  • 4,095
0 votes
0 answers
24 views

VSCode/eslint/prettier does not auto-format _app.tsx file on save

I have a fairly extensive eslint/prettier config. Normally it works great, but today I noticed that for some reason my _app.tsx file does not auto-format the same as other pages. In this case, it's ...
  • 4,773
1 vote
0 answers
26 views

Prettier overrides ESLint options

in my .vscode/settings.json file I have: { "[html]": { "editor.defaultFormatter": "esbenp.prettier-vscode", "editor.codeActionsOnSave": { "...
0 votes
2 answers
116 views

prettier-tailwind-plugin isn't working as expected when I hit save in VSCode

I installed the prettier-plugin-tailwindcss and it successfully sorts the Tailwind classes when I run Prettier using npx prettier --write index.html. However, when I hit save in VScode, the prettier-...
1 vote
1 answer
24 views

Glob pattern for different file types in different directories

I want to configure my IDE (PhpStorm) to run Prettier on save, for different file types in different directories, but it only accepts one glob pattern. I want one pattern that will do the work of both ...
  • 3,546
0 votes
0 answers
16 views

How to uningore directories in .prettierignore

I need to make prettier format code only in one directory, omitting the rest. I set up my ./.prettierignore like this: /* !/some/dir/ but everything in /some/dir/ is ignored too when i run prettier --...
-2 votes
0 answers
36 views

How to configure Prettier to only reorder Tailwind classes

Tailwind CSS features a Prettier plugin which reorders the Tailwind classes in HTML files. However, Prettier also applies all other rules to the files such as max line width or whitespace between HTML ...
  • 3,282
0 votes
1 answer
32 views

ESLint + Prettier adds parentheses wrong on Angular pipe

So, we have an Angular project running on version 8.2.14, and we recently introduced Prettier and ESLint as an autoformatter to keep everything to a standard. However, Prettier formats the parentheses ...
  • 13
0 votes
0 answers
24 views

Prettier Typescript configuration for keeping the object in one line but its type definition in separate lines

I have code with functions of this format: export const loginService = async ({ email, password }: { email: string; password: string }) => {} I want all these functions to be formatted in this ...
  • 41
1 vote
0 answers
102 views

ESLint: 8.35.0 Error: "prettier/react" has been merged into "prettier" in eslint-config-prettier 8.0.0

Oops! Something went wrong! :( ESLint: 8.35.0 Error: Cannot read config file: /home/jenkins/workspace/ Error: "prettier/react" has been merged into "prettier" in eslint-config-...
0 votes
1 answer
60 views

Prettier not working on save from within Visual Studio Code

It appears the formatting via keyboard and formatting from the menu are not on the same page, but I don't know why. Below are my exact detailed steps... From Visual Studio Code 1.75.1 I installed the ...
  • 7,255
-1 votes
0 answers
13 views

how to disable line break with prettier when using Emotion

before prettier: <div css={css`display: flex; justify-content: space-between;`}> </div> after prettier: <div css={css` display: flex; justify-content: space-between;...
  • 1
0 votes
0 answers
11 views

What formatting tool can I use to make my Tailwindcss classes align horizontally?

Does anyone have any formatting tool to go from this to this? Prettier doesn't work, I've tried the prettier-tailwindcss plugin too, it doesn't work too. How can I change from this: <div ...
0 votes
1 answer
23 views

How to configure vs code prettier extension

I have configured the HTML prettier.printWidth": 200, but its still breaking the buttons like below <div classNameName="col-lg-12 text-center my-3 btn-group-div" style={{ textAlign: &...
0 votes
0 answers
119 views

VS Code ESLint No Quick Fixes Available on Svelte files only

For some reason, when I hover over an ESLint issue on a Svelte file, it'll state that it knows there's an issue, but that there's no quick fixes available. However, if I go to a TypeScript file, I ...
  • 2,817
-1 votes
2 answers
82 views

eslint prettier: commas on objects?

I seem to have a problem with ESlint & Prettier in Vscode. As far as I can tell everything is configured correctly, where <;> will be added on save, but not <,> for objects. Eslint ...
  • 37
0 votes
1 answer
77 views

Prettier force white space before and after every balise in HTML

I work on a project using Prettier, the project use Nuxt(Vuejs framework). I see a really weird behaviour about Prettier and the HTML rendered. If i have a balise (h1,h2,div...) like this: <h2>...
0 votes
0 answers
113 views

prettier throws error `Failed to resolve a parser`

Prettier throws error "failed to resolve a parser". Prettier is selected in Workspace, User and Python > Workspace, so I'm out of ideas why the error is thrown... ["INFO" - 08:...
  • 1,370
-2 votes
0 answers
8 views

Prettier configuration messes up my code?

Prettier changes the style of my code in a bad way After saving with prettier: Before saving: I dont know how to solve it.
1 vote
1 answer
33 views

python subprocess.run("npx prettier --write test.ts", shell=True) does not work but running "npx prettier --write test.ts" in terminal does not

My file structure: test.py test.ts and I am attempting to format the TypeScript file using a Python script. (Running this on Command prompt in Windows) However, when I run my python file with ...
  • 153
1 vote
1 answer
34 views

Unable to get prettier to format nicely

I am having some difficulity with prettier. I use a husky pre-commit to format files, which runs prettier --write \"./**/*.{js,jsx,json,ts,tsx}\" This works as in prettier is ran, but it is ...
0 votes
0 answers
68 views

How do I fix the first line to the top of the screen when vscode's saving?

enter image description here I'm using vscode prettier, and at some point when I save the code, the end line goes up to the top of the screen. If you scroll down, the first line isn't gone, it's still ...
0 votes
1 answer
31 views

Svelte: The formatter auto closes tags which are empty "<div/>"

I have installed Svelte for VScode and Prettier extension for my project. This issue appeared randomly after a week and only happens with .svelte files. On save, it formats empty <div></div&...
0 votes
0 answers
33 views

Disabling prettier in ESLint in VSCode

When I try to use the Microsoft ESLint extension in VSCode it complains about pretty much every line in my JS file being incompatible with Prettier. I thought Prettier was a separate extension and I ...
  • 2,733
-2 votes
0 answers
31 views

How can i deal with prettier behavior?

Prettier is messing my arrays so when i have a long array and i click save, prettier format it to a lot of lines so every item toke one line. i'll add some pictures to see the problem.. I want to have ...

1
2 3 4 5
31