Visual Studio 2017 Stop All JavaScript Formatting [duplicate] - javascript

I prefer my own style of code formatting as opposed to Visual Studio's default settings. I've turned off auto-formatting options in Tools→Options. In most cases, it works.
However, after using any of the built-in refactorings, Visual Studio clobbers my settings with its default settings. How do I keep VS from doing that?

I had this problem while writing VB in an aspx page.
The solution was to go to 'Tools > Options > Text Editor > Basic > VB Specific' and turn 'Pretty Listing' OFF.
Note - in Visual Studio 2015 this can be found at:
Tools > Options > Text Editor > Basic > Advanced

Disable pretty listing. It is the option that re-formats what you are doing. I had the same discomfort with it and after doing it, my code stays how i want and it doesn't go back to previous settings.

As suggest by #TheMatrixRecoder took a bit of finding for me so maybe this will help someone else.
Unitick these options to prevent annoying automated formatting when you places a semicolon or hit return at the end of a line.

You might have had Power Tool installed.
In this case you can turn it off from 'Tools > Options > Productivity Power Tools > PowerCommands > General'

In my case, it was ReSharper.
Test if ReSharper
StackOverflow: How can I disable ReSharper in Visual Studio and enable it again?
Prevent ReSharper from reformatting code
StackOverflow: Is there a way to mark up code to tell ReSharper not to format it?
Update 2017-03-01
It was ReSharper in the end:
Update 2020-12-18
On the latest version of ReSharper, there are more options: untick everything on this page, and ensure all dropdowns are set to the equivalent of None.
ReSharper "typing assist" is like a 3-year-old trying to "help" build a card castle. A simple backspace or an enter key will (poorly) reformat entire blocks of code, requiring it to be undone or painfully formatted back to the original.
And if that is not enough, this is the bit that adds delays when typing so sometimes it feels like trying to run in skis.

The reformat on semicolon or closing brace cannot be turned off. I find it infuriating the Microsoft would have the temerity to tell anyone how to format code; the most illegible code I have ever seen was while working there.
I want adjacent assignments to be vertically aligned; VS reformats them to one space on either side of the equal sign irrespective of the length of the variable on the left. This is intolerable. And turning it off on the editor options is ignored; given comments like the opener above I am certain this is deliberate.
Consistency is only a virtue when it leads to desirable outcomes. This is not one.

VS2015 settings that helped me prevent auto formatting:
(and Tools > Options > Text Editor > Basic > Advanced, just like Tango91 suggested)

In VS2017 you can change it after selecting your coding language in the settings menu. There is an option called "new Lines" in the "Formatting"-submenu.

I see that many answers here solve the problem for a specific situation.
For my situation I continually found that the IDE would automatically format JavaScript code within an ASP page.
To disable, I unchecked this box:
In addition, I found it very helpful to use the search query in the toolbar (CTRL+Q) and just search for the text format on paste. As you can see with the scroll bar, there are quite a few options to check!

I doubt that you can disable re-formatting after refactoring. Refactoring changes code and since it's only text I doubt what you'd want is that it just dumps unformatted text into your source. Wouldn't it be a little easier to just set the code style VS adheres to to the style you like and follow?

Follow TOOLS->OPTIONS->Text Editor->CSS->Formatting
Choose "Compact Rules" and uncheck "Hiearerchical indentation"

It can be the case of Clang Format.
Previously, the entire file is automatically formatted on file save, and it drove me nuts (for the repositories which Clang Format is not enabled).
Such behavior is gone after turning "Tools -> Option -> LLVM/Clang -> ClangFormat -> Format On Save -> Enable" to False.

I was pissed off every time I pasted anything in cshtml file in Visual Studio 2015, 2017. I tried different settings and finally found the proper one:
Options => Text Editor => HTML => Advanced => Paste (Format on paste) => False

You can tweak the settings of the code formatting. I always turn off all extra line breaks, and then it works fine for how I format the code.
If you tweak the settings as close as you can to your preference, that should leave you minimal work whenever you use refactoring.

In addition to Tango's answer for the actual solution, there may be people actually want to stay current with auto-formats but not have it screw up your relevant changes. I would suggest that you modify the file to have auto-format activate, check in those changes, then proceed with the actual changes you wish to make.
That way your code can stay up to date, but your check in will be relevant.

You might need to check on Tools-> Options-> Xaml Styler -> Format xaml on save

On the navigation options at the top select "Tools" and then select "Manage Extensions".
I had CodeMaid, Visual Assist, and Rosalyn installed. Seems like an update start to cause these auto formatting issues. I disabled them and do this fixed it.

Related

Latest version of Visual Studio Code IDE prevents styled-components-snippets from running — how do you fix this? [duplicate]

I have a user snippet configured in Visual Studio Code. Let's take one of the items in this snippet: one with the prefix imp.
Now, prior to the recent VSCode update, as soon as I did something like the following.
it automatically showed the autocompletion box to me (I didn't have to press Ctrl + Space to activate it), as shown below:
But now after the update, something strange has happened. When I type in just im, obviously, it shows me the <img> autocompletion suggestions as shown below:
But when I continue to type the full thing imp, the autocompletion box gets hidden. It's only when I press Ctrl + Space that I get the autocompletion box again.
What is the reason for this problem and how to fix it?
I can reproduce your issue exactly, which led me to look to see if it has been reported on github. It has, see Snippets gone from IntelliSense.
From same issue as above:
I have pushed a fix for next insiders and I have pitched this for the
1.75.1 recovery release
It is in today's Insiders (I just tested it) 02/03/2023.
So you can either try the Insiders Build now or wait for the Recovery Release. And continue to use the manual trigger of Ctrl+Space in the meantime.
As #WayneBloss mentions in a comment below, disabling the snippetsPreventQuickSuggestions setting might fix the issue.

basic shortcut ( "Exclamation Mark" Enter) on vs code not working? [duplicate]

Every other snippet is working, but !+tab is not.
! snippet is not working
other snippet is working
I am using Visual Studio Code. I'm using 1.69.0. It was working before, but I wanted to add net html file, named that new.html, because I had index.html already. After that this script stopped working on every html file, but other scripts like "a", "div" etc. is working.
The v1.69.2 recovery release is out now. Emmet in html is working as it should for me now.
Looks like it will be in the Recovery Release, see https://github.com/issues?q=is%3Aissue+label%3Acandidate+repo%3Amicrosoft%2Fvscode+repo%3Amicrosoft%2Fvscode-internalbacklog+repo%3Amicrosoft%2Fvscode-remote-release+milestone%3A%22June+2022+Recovery+2%22+.
Don't know when the recovery release to Stable - presumably v1.69.2 - will be released. The .1 release is out and the fix is not in it.
It has been fixed though, see https://github.com/microsoft/vscode/issues/154375, and should be in the Insiders Build tomorrow (07/13/2022).
Testing the latest Insiders: ! is working. As is ul>li*3 type expansions (although that never stopped working for me - but it has been reported elsewhere). Should be in the v1.69.2 release out soon.
It is a known issue with the v1.69 release, see html emmet suggestion not automatically display or https://github.com/microsoft/vscode/issues/154517 for example. Lots of issues on github on ! and * not working.
So the emmet snippet will not appear automatically when you type !, but you can press Ctrl/Cmd+Space (which is the command Trigger Suggest) to make it appear and select normally.
Try Ctrl/Cmd+Space for anything emmet-related nnnnnot working in vscode v1.69.
You could also go back to v1.68 to solve the issue.
Try to write "doc" instead of "!". "doc" works for me.
On Windows 10, this worked for me:
Go to "Settings" and type "emmet.trigger" in the search
A checkbox for "Emmet: Trigger Expansion On Tab" will appear
Check the checkbox for allowing Emmet to trigger expansion on tab
After I did that, it worked just fine for !+TAB and any type of mulitpliers (i.e. li*4+TAB).
You need to check this option or put "emmet.triggerExpansionOnTab": true in settings.json to use the emmet abbreviation pressing TAB. I realized this ones what is not working:
!, lorem, >, and .
Examples of use: ul>li, li3, ul>li*3
None of them shows the preview of the emmet, and you can't use them pressing TAB without enabling the option that I sayed above, and even checking the option you won't be able to see the previews, you'll need to know them by yourself and press the TAB even though nothing showing that it's a emmet abbreviation.
You can use CTRL + SPACE too.
Edition Windows 11 Pro
Version 21H2
VSCODE Version 1.69.0
I had the same issue with the ! not working. I found another shortcut that does the same thing: type html:5, and press enter.
Looks like a bug, I have the same problem with 1.69.1, the VSC team is aware and fixing it. Should be fixed with the next release soon.
Meanwhile, you can use either HTML:5 or doc
meanwhile use "HTML:5"
enter image description here
or use "doc"
enter image description here
While #Mark's answer works, another work around would be to use the html:5 snippet which still works as expected in v1.69
Yes, I am facing this issue too since the latest update.
Somehow the solution I have got is :
You can check the box “Emmet: Use Inline Completions”
In settings by typing “emmet” in the setting’s search.
You can see the suggestion now and choose it by pressing the tab.
This is the solution I have got till now but hoping that we could have the previous version back.

HTML Fomat selection disappeared with V1.30

On VS Code HTML or JavaScript if I select a block of code and by clicking on right button on the options available I could "Format Selection" which indents ar auto-format the selection.
After updating to V1.30 this option has disappeared from right click context menu.
Do you know why? How can I enable again?
Thanks
You can shorten this sequence you're following by just enabling autoformat. Just go to your VS settings and search for autoformat and enable it for the required languages. It might ask you to install extensions for linting depending on the language.
Go to File -> Preferences -> Settings and then type in format in the search bar at the top of that page, and check the settings in there, there are a lot of ways to format the code, so you may find some new stuff there that will be beneficial as well as which setting you have turned off. I just upgraded and have the format functionality still in my instance.

My javascript file is displayed as a single line of text in the chrome debugger. Why?

I seem to run into this randomly. It usually displays the file normally, but sometimes it's all scrunched onto one line. I can't figure out what's causing it.
N.B.: In the current version of Chrome, this is actually done by clicking on the {} icon ("pretty print") on the lower left of the developer tools pane.
Ah, figured it out. The line endings on the problem file got set to Mac format somehow, while the rest of the files were Windows format. Not sure how the format swapped but it's easy to convert back (in Notepad++ just go Edit -> EOL Conversion).
You already answered your own question, but this is a good place to note that Chrome (as of v12, currently in dev channel) has a built-in pretty-print function that can make quick work of the typical one-line JavaScript files that all well-behaved websites generate. In Web Inspector's Scripts tab, select a file via the usual dropdown, and right click on the source code. Selecting "De-obsfucate Source" will format the file in a reasonable way, and even allow you to set breakpoints inside the newly reformated code. It's quite helpful.

How to change the indentation width in emacs javascript mode

I'd like to use 2 spaces for my indents instead of 4. I can change the default behavior of C mode using:
(setq c-basic-offset 2)
How do I change this in javascript mode?
js-indent-level can be used in the default javascript-mode, which is included by default starting in emacs 23.2.
(setq js-indent-level 2)
should do what you're looking for. If you're using an older version of emacs, you may be in java-mode. I think this mode responds to c-basic-offset, however I may be wrong.
I wish someone had told me about Custom a lot sooner! Perhaps this will help another mere mortal like me ;)
Invoke Custom:
M-x customize
Then, choose "Programming," and then "Languages," and then select a language/mode to customize. Edit the options as you see fit. When done, choose either "Save for current session" or "Save for future sessions."
If you're using js2-mode (which is more powerful IMHO), then the command is:
(setq-default js2-basic-offset 2)
Source.
You might also want to set emacs to use spaces instead of tabs
(setq-default indent-tabs-mode nil)
You can also use
M-x customize-variable
and type
js-indent-level
(js- [TAB] shows a list of options). Then change the Js Indent Level as wanted and click [State:] and save.
In my javascript.el file (/usr/share/emacs/site-lisp) I found
javascript-indent-level 4
So if you are using the same lisp-mode you can change it by running
(setq javascript-indent-level 2)
Using EditorConfig could be a good idea too. And of course, Emacs had a mode for it editorconfig-emacs.
It's also available in the package manager (M-x package-list-packages) through Melpa or Marmalade.
If you want to change it on a per-file basis, put this at the top of your file:
// -*- mode: js; js-indent-level: 2; -*-
None of these solutions worked for me after upgrading to Emacs 26 (I already had js-indent-level set to 2 but my tab width went back to 8), but what did work was setting the tab-width variable to 2, which seems to replace the old default-tab-width variable.
I found this in M-x customize by searching for tab width.

Categories

Resources