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

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.

Related

Getting format on save to work with a default formatter

I am trying to set a default formatter for a specific workspace to Prettier and make format on save work nicely with each other. I tried this as follows:
(format on save is also enabled in the User settings)
For some reason, this is not working for me. If I manually run the format command via VS Code's command pallet, it formats using Prettier just fine.
Is there something I got wrong or another setting that needs configuring?
Check if in your settings.json file, { "editor.formatOnSave": false } is set to False, if yes, set it to true, I don't know why, but this value could still be set to false, even if both your above settings are turned on.
check:
{
"editor.defaultFormatter": "esbenp.prettier-vscode",
"prettier.configPath": "./personal.yml"
}
if not, update the editor.defaultForamatter here to the shown value
Also, in your Editor:Default Formatter to None. Note that this is an alternative method (if above doesn't work)
Scroll down to check if formatter if enabled(checked) for all your languages
If this too doesn't work, one can always try rolling to a different version.
Or as a last resort, you can try uninstalling and installing vscode
Follow these steps:
CTRL + SHIFT + P
Format Document (in pop-up bar)
Select Format Document
Select Configure Default Formatter...
Select Prettier - Code formatter
Done!

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.

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.

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.

Set encoding permanently in Visual Studio Code

I am using Visual Studio Code to write a LaTeX file with the LaTeX Workspace plugin.
However everytime that I open VS Code it insists that the encoding of the TeX file is UTF-8 and makes all the special characters go bezerk, but for some reason TeX Live doesn't compile in that encoding even if I convert it. Since another person is using the file too and their editor is set in Windows 1252 encoding, I want to keep using that.
How to set a encoding to a file permantly (or to an extension) in VS Code?
There are language-specific configurations. CTRL-Shift-P and see "Preferences: Configure Language Specific Settings... However, I do not see a LaTex choice there. But you may because of the LaText Plugin. So you could do something like:
{
"[latex]": {
"files.encoding": "windows1252"
}
}
If you don't see one perhaps you could associate your file extension (.tex?) with one on the list and then the above setting?
I assume you have
{
"files.autoGuessEncoding": false
}
already set to false - the default. WTH, try "true".
And see Allow to set files.encoding as language specific setting for files on startup so the lanuage-specific setting should work better on start-up.
Your settings.json per user or per workspace can contain an encoding directive.
If you want Java files opened in UTF-8,
then the following has no effect
"files.encoding" : "utf8",
but this works
"[java]": {
"files.encoding": "utf8"
}
The existing answers show a possible solution for single files or file types. However, you can define the charset standard in VS Code by following this path:
File > Preferences > Settings > Encoding > Choose your option
This will define a character set as default.
VSCode set default file encoding
Sven Eschlbeck's answer illustrated:
The following page will be opened. There are many settings. To get to the desired item without scrolling through all entries, type "Encod" in the search box. Observe that the item "Files: Encoding" is presented to us. Now we can change the setting.
Tips to share with you: "GB18030" applies fairly well universally for source code files containing Chinese characters.
More tips:
The encoding being applied to the current file is shown in the status bar. Mouse right-click this to call up the options as shown.
Here, you can switch encoding ad-hoc.
Having autoGuessEncoding true in USER and autoGuessEncoding false, "files.encoding": "windows1250" in WorkSpace was still giving me windows1252.
I do not uderstand why User overchanged WorkSpace. I have to disable autoGuessEncoding also in USER to finally get "files.encoding": "windows1250" work everytime.
So you can face the same issue and this could help.