VSCode Prettier Formatting to change data in single line - visual-studio-code

I am using VSCode extension prettier to format my code .But when I format it I want that highlighted part comes in a single row instead of multiple rows.
(All settings are default except prettier.printWidth :3000 it was prettier.printWidth:80 by default)
Screenshot 👇

Related

How to get the same format for vim-prettier and vscode-prettier?

I have vim-prettier installed and also have the vscode extension for prettier installed.
They format differently however. I would like to use vim-prettier to format the same way I would for vscode's prettier.
I followed vscode's configuration and it lead me to /home/user/.prettierrc.json but it is empty and only has {} inside of it.
I put let g:prettier#autoformat = ["/home/user/.prettierrc.json"]
inside my .vimrc file but it does not format to the same way vscode-prettier does.
Is there a way to do this?
So first I tried whereis prettier and compared it to the value i get from running :PrettierCliPath
prettier is in /usr/local/bin/prettier
and the one that vim uses is in /home/user/node_modules/.bin/prettier
I tried to set my vimrc to point to the first one via
let g:prettier#exec_cmd_path = "~/path/to/cli/prettier"
But it didn't work. It gave me a syntax error whenever I tried to run prettier in vim.
After a long time I noticed this line in the README for vim-prettier
Note: vim-prettier default settings differ from prettier intentionally. However they can be configured by:
and it gave a bunch of settings like let g:prettier#config#print_width = 'auto'
So I ended up just manually configuring each setting to the desired result.
Now I want to find a way to only allow these settings for a certain filetype(html) so that the formatter for html and css are different instead of the same.

Setting prettier sections order in .svelte file

Whenever i save a .svelte component file in visual studio code
Prettier formatter is formating my file in this order:
Script
Style
HTML Markup
I want to change the order of the sections to be:
script
HTML
Style
How can i change the order of the sections?
This should be the default sort order with v2 of the Svelte Prettier plugin. If you can, install the latest version of prettier-plugin-svelte.
If you can't update, you can use the svelteSortOrder setting in your Prettier config.
{
"svelteSortOrder": "scripts-markup-styles"
}

How to add Format config file to VSCode workspace using Ionide

I want to add specific workspace setting for Formatting for F#
I see that Ionide for VSCode uses FsAutoComplete which in turns uses Fantomas as the Formatter and that Fantomas has config file support (not documented), but I tried to add .fantomas-config and fantomas-config.json in the root of my project and the config file was ignored.
Ultimately what I want to achieve is:
preserve new lines made by me.
set the "word wrap" column length
Other common formatting options like indentation etc.

How to set VSCode typescript format for if statement

I'm trying to config the VSCode format to not set a new line after && in if statement
I'm trying to search after some new line functions at the settings.json
this what happened today after format
I'm trying to set the format do this
In VSCode, go to Settings > Text Editor > Word Wrap, and turn it off.
Alternatively, go to Settings > Text Editor > Word Wrap Column, and increase the column in which words will wrap (default is 80 I believe).

VSCode convert project to 4 spaces

I used the Vue cli to create a project and it uses 2 spaces by default. I want to get 4 spaces. I've turned off detect indentation, set tab size to 4 but no amount of running format document will change - for example - this little js file that was created.
I also tried to change things with eslint. It spots the errors but --fix has no effect
If I start a new object then the spaces are correct though.
I am using an extension called Vetur and in my VS Code settings file I added the following rule: "vetur.format.options.tabSize": 4,
Also for initial indentation I have added the following rules:
"vetur.format.styleInitialIndent": true,
"vetur.format.scriptInitialIndent": true,
If you are not using this extension, do you have a .editorconfig file in your solution and/or have you looked at your VS Code settings for conflicting rules?