How can I remove newlines and interstitial whitespace from a selection of markup in VSCode? - visual-studio-code

If I have a bit of HTML, XML, or JSX formatted like this:
<p class="foo">
<b class="bar">
some text
</b>
<p>
I would like to be able to make a selection from <p> to </p>, run a command (ideally via an assigned keyboard shortcut), and have VSCode convert it to this:
<p class="foo"><b class="bar">some text</b><p>
As context, I sometimes need to process a fair amount of marked up text in a variety of file formats, and it's very tedious to manually do this kind of formatting (or unformatting). I know you can do it with a regex find and replace in selection, but that's inconvenient because (1) there doesn't seem to be an easy way to save a set of find/replace settings as a macro and then assign them to a keyboard shortcut, and (2) VSCode's handling of the "in selection" part of find/replace all confuses me every time I use it.
I used to do this in my previous editors (e.g. BBEdit, TextMate, Sublime), but I'm hitting a wall with VSCode. The best I can find is minify/uglify extensions that work on entire files. And tons of basic tips about toggling word wrap, automatically removing trailing whitespace, etc.

Related

Prettier - allow line breaks between html elements

I'd like to keep some space between some html blocks in my code. However, Prettier wants to remove these lines. Is there a Prettier setting to keep this spacing?
Before prettier:
<template>
<form>
<div>First block</div>
<div>Second block</div>
</form>
</template>
After pretter:
<template>
<form>
<div>First block</div>
<div>Second block</div>
</form>
</template>
There is no way to actually do this, you might only use tricks.
First trick
Ignore completely the file (or file extensions) but you will not benefit from Prettier
Second trick
Deny Prettier to trim whitespaces
trim_trailing_whitespace = true
And add whitespaces in line breaks.
Once again this is not an effective solution, it's only a trick.
An issue has been closed by devs
adding and removing line breaks is core to prettier's formatting algorithm
According to #suchipi , Github member:
adding and removing line breaks is core to prettier's formatting algorithm, so preserving them isn't consistently possible.
As a work around you can try:
setting very short printWidth
put // prettier-ignore comment above your code.
For Refernce:
Github issue
Is there a config in prettier to keep line breaks?
Don't know if this will work as intended however, in the document for Prettier, there is a section for "Empty Line" that says;
"Prettier collapses multiple blank lines into a single blank line."
By this, you may want to add a double blank line instead of a single blank, where you are wanting a space to be, as it should compress it into a single line rather than removing it all together.
Take a look on this thread https://github.com/prettier/prettier/issues/4870, it's pretty good explaining why this is still non-existing feature.
There is no simple way for formatter to determine what to keep and what to remove.
So the only practical things you can do
Add comments to disable formatting in certain places (which is bad idea and never work well, dev gents become annoyed with this super quickly).
Accept that empty lines would be collapsed (still bad, because of poor readability)
Disable this feature and maintain empty lines yourself (alternative editor). This one "arguably" seems to me the simplest (best) option in a long-term.

Make VSCode intellisense show up only after certain number of characters

I can't seem to find if there's a way to do it.
I use VScode for writing markdown text. I love the intellisense/autocomplete which builds my word lists and helps me write faster. The one thing I wish I could change is for the autocomplete word lists to show up AFTER I've typed a certain number of characters.
For e.g., let's say I really want the word "guarding"
I'd like the popup only after I've typed guar rather than at g, and then u, etc. This way, I'm utilizing it only for longer words. The popup for every letter from the beginning is kind of annoying.
Is there a way to do it? (I seem to be able to control the delay when to popup,

Is it possible to configure Sublime Text 3 to insert a newline on some auto completions?

The auto completion is pretty much default right now. If I type
<p{tab}
I get
<p></p>
Is it possible to configure it so that instead I end up with
<p>
</p>
This is just an example. I'd like it to be more comprehensive beyond just the <p></p> tags.
It seems I've been doing it wrong. I've been looking at what happens only when I tab-complete a tag as in my example. It did not occur to me that simply pressing enter after the auto completion that it would actually set me up the way I would like and even better than I was asking for.
After pressing enter I end up with
<p>
_
</p>
with the cursor (represented by the _) indented two spaces on the blank line.

Is there a way to make emacs ispell/aspell ignore shoft hyphens in HTML?

I write mostly my documentation in HTML using emacs as my main editor. Emacs let you interactively spell-check the current buffer with the command ispell-buffer. (I think the underlying program used for doing the spell-check is named aspell.)
When emacs is in HTML-mode, text is stripped for all HTML markup before the remaining text is being spell-checked.
However, soft-hyphen entities (­ or ­) are not stripped, so a word that is written as speci­fies in the HTML text is spell-checked as two separate words (speci and fies) which is not what is wanted.
Is there a way to make emacs ispell/aspell ignore shoft hyphens in HTML?
Or can anyone suggest an elisp function that will strip soft hyphens out of the HTML text before it being handed over to aspell for spell-checking?

Shortcut for "code block" macro in Confluence editor

We use confluence for documentaion but i find very time consuming to select the code macro; it's a 5 step process. Even typing the macro by hand is not efficient.
In the Stack Overflow editor all we have to do is select the text and press a button or hit ctrlK, and the text is formatted as code.
Is there a way to do this in Confluence?
even typing by hand is also not efficient
I use the code macro extensively and always use the autocomplete feature by typing { and choosing 'Code Macro' from the list (It's enough to type co for the code macro).
This is a very efficient.
Of course a keyboard shortcut would be faster, but there is no shortcut for the code macro. (AFAIK there is no keyboard shortcut for a specific macro at all)
I use Ctrl-Shift-D then wrap the text in {code}.
This also fixes the problem with formatting being stripped from pasted text.
In Confluence 5.x if you edit a page, you can type {cod<enter} and it puts a Code Block box on the page, but when code is pasted into this box it can strip out end of line characters.
Open the Insert Markup window using Ctrl-Shift-D
Paste in your code as plain text This way the formatting is not stripped out.
Add {code} tags.
You can also type three back ticks ``` to create a code block as you would in vanilla Markdown. This creates an empty code block very quickly. I never have with problems with formatting when pasting code in this way.
The one irritating feature of this method is that you can't specify the language as you do in Markdown, you have to select the language from a list.