Prettier Extension adding double brackets to if statement - visual-studio-code

I have my Prettier extension set to make my code prettier on save. It works amazing 99% of the time...
However:
If I type
If (x = 14) {};
my prettier extension in VsCode will change it to
if ((x=14)) {};
which will cause nothing to work. I have tried everything to fix this. Prettier is great, but this is so annoying, please help ...

It looks suspicious to me that you use single equal sign in the if statement. Are you sure you want to assign a value? Not sure why prettier uses double brackets though. It may be to highlight the unusual.

Related

VSCode Rust add semicolon on save

I am using the Rust extension on vscode and NOT rust-analyzer. However, when I am saving a file, vscode is using rustfmt to format my file but it doesn't automatically insert semicolons. I have a trivial function like this
fn call_me() {
let x = 5
println!(x)
}
It doesn't add the necessary semicolons. How do I make it add semicolons? Are my installations somehow messed up?
Also, I have tried rust-analyzer and it doesn't add semicolons either.
Unlike JavaScript, semicolons are not syntactically optional in Rust. Thus, leaving them out is a syntax error, not just a matter of style, and rustfmt (the standard Rust code formatting tool) doesn't ever attempt to fix any syntax errors, no matter how “obvious” they might be — if it reads a file with errors it will not make any formatting changes.
(I don't know if there's a way to get rust-analyzer, vim, or VS Code to auto-insert semicolons as a matter of editing rather than formatting.)
Maybe not what you're looking for but there are language-agnostic options to reduce the friction of semicolon insertion.
For instance the vs code extension colonize adds the shortcut alt+enter which appends a semicolon and newline, no matter where in the line the cursor is.

VSCode Prettier attribute formatting

I'm using prettier to format my Vue files, but can't find to seem a setting that puts props/attributes of html elements to new lines.
I'd like to make sure that my code is always formatted as it is for v-text-fieldin a yellow frame, rather than below. I set Prose Wrap to "never", but I guess that was not it. Any help appreciated!
You can set the setting of Print Width to higher value.
That's what Prettier does: breaks lines if they get too long. It doesn't make sense to use Prettier if you don't need its line-breaking behavior as this behavior and Prettier are one and the same.

configure prettier to push curly braces on new lines & not clear empty lines

I am using prettier with VSCode, How can I configure it to format my code like this :
function test()
{
if()
{
MYCODE GOES HERE;
}
}
I want the { and } on new lines, and an empty line after { and before }.
Currently, it moves the curly brackets to same lines if condition or function name, and also remove the empty lines after/before { and }.
Prettier is considered an " opinionated " formatter, which means it doesn't let you choose things like that. If you want more control over the formatting, you can use a different formatter.
The built-in VS code formatter allows you to do what you're looking for, just search the settings for " function new line " and similar options.
There are of course many other formatting extensions available in the VS code marketplace as well. Whichever you choose, you will have to select it has your default formatter in your VS code settings.
As mentioned in this answer, VS Code's formatter itself works quite well, but if you want this to be part of workflow, then using ESLint might make things easier. There's a rule called brace-style.
You can then run eslint ./path/to/your/file --fix to format your code, or eslint . --fix to format code in the entire project directory.
Disclaimer: I use ESLint for code formatting most of the time and it works for me. I actually use it to find & fix problems too so it's like killing two birds with one stone, but note that ESLint is more about finding problems in the code and fixing them, so using ESLint just for code formatting might not be the best idea.

Prettier formatting with double quotes

Anyone else come across Prettier formatting code with Double quotes instead of Single even though you
explicitly set it to replace with single in the preferences?
Here is a pic:
After a recent update to VSCode I started getting this issue and it is driving me crazy.
Any ideas as to how to fix this. Am I wrong that the Prettier: Single Quote in fact does not format with single quotes instead of double?
Thanks.
Try to create file .prettierrc at package.json level with property singleQuote set to true as below:
{
"singleQuote": true
}

turn off "use spaces, do not use tabs" in a jslint extension for VSCode

I got a VSCode JSLint extension and I got its settings pointing to an .eslintrc file where I have the following specified for indentation:
{
...
"indent" : [1, "tab"]
...
}
The problem is, it's still putting the squiggly green lines where I have some tabs and I can't tell where anything's going wrong with any settings.
I have evidence the rc file is actually working because I was successfully able to change it from single to double-quotes. However it appears to completely ignore the indentation setting inside my VSCode.
You could simply disable the use_spaces rule. It's separate from the indent rule you changed. A bit over an oversight from JSLint.
There were quite a few complains about that rule, even here on SO. Quite a few people (not only on SO) suggest switching to JSHint instead. Personally I've only used ESLint and therefore don't know much about the differences, and I'd suggest checking those for yourself anyway.