Visual studio code + format code command - visual-studio-code

In referencence to this question
How do you format code in Visual Studio Code (VSCode)
Shift + alt + f (to reformating code) work fine
But i have a problem :
Can we keep carriage return (or new line) in memory ?
because if i do (for more lisibility) :
<form>
<div class="form-group">
<input type="text"
class="form-control"
placeholder="Enter a name">
</div>
</form>
If I use reformating code command, it came back to the start, all inline.
How can this be avoided ?

Related

VSCode Prettier formats HTML in an odd way (greater-than-symbol on next line)

Since today VSCode with installed Prettier Extension formats my HTML in a really odd way. For example:
<button
class="btn btn-secondary mr-2"
(click)="updateEditState(EditState.preview)"
*ngIf="!(preview | async)"
>
<ng-container i18n="AppPreviewEditButton|Enables the Preview mode of the page##AppPreviewButton"
>Preview</ng-container
>
</button>
<button class="btn btn-secondary mr-2" (click)="updateEditState(EditState.edit)" *ngIf="!(edit | async)">
<ng-container i18n="AppPreviewEditButton|Enables the Edit mode of the page##AppEditButton"
>Edit</ng-container
>
</button>
Notice the > on new lines. Did somebody else experienced the same and has a solution?
You should set "htmlWhitespaceSensitivity": "ignore" in your project's .prettierrc file.
https://prettier.io/docs/en/options.html#html-whitespace-sensitivity
Since the issue finally got resolved:
You can now use bracketSameLine: true in the prettier settings to control the behaviour.

VS Code emmet enter behaviour

When I type .class and use emmet I get:
<div class="class">cursor's here</div>
And when I press enter I get:
<div class="class">
cursor's here</div>
And I have to press enter again + arrow up+ tab, its so annoying!
Intead of (like in sublime):
<div class="class">
cursor's here
</div>
Is there any way to change it?
In Settings Ctrl+,
"emmet.preferences": {
"format.forceIndentationForTags": ["body", "div"]
},

Delete Closing Tags with line in notepad++ (HTML)

If in notepad++ I want to delete a line which has a < div> tag on it, is there a way to automatically delete the closing line containing < /div> without deleting the lines inbetween?
So in this example to delete lines 1 and 18 whilst retaining lines 2 to 17
image of code at: http://i.imgur.com/UdllZqY.png
This solution is a little bit convoluted bit it can be done purely in notepad++
Make sure you have the HTML Tag plugin installed. This can be done by going into Plugins > Plugin Manager > Show Plugin Manager, selecting the plugin named HTML Tag and installing it (if you haven't already). Or install it manually by downloading it from here
Have your text cursor over the start or end tag of the tags you want to remove and press CTRL+SHIFT+T. This will select the entire element and all of its children
Press CTRL+H to bring up the find and replace window.
->Select Regular expression mode,
->make sure 'In Selection' is checked,
->use the expression (?s)\A<[^>]*>(.*?)<[^>]*>\Z in the 'find what' text box
->and the replacement \1 in the 'replace with' text box.
Now press the replace all button to remove the first and last tag.
Repeat steps 2 to 4 for any other replacements of this kind.
Using this method the example:
<div class="col-md-4 sidebar">
<div class="panel panel-default">
<div class="panel-heading">
News Feed
</div>
<div class="panel-body">
Past Posts
</div>
</div>
<p class="lead">News feed</p>
<ul>
<li>post 5</li>
<li>post 4</li>
<li>post 3</li>
<li>post 2</li>
<li>post 1</li>
</ul>
</div>
Becomes:
<div class="panel panel-default">
<div class="panel-heading">
News Feed
</div>
<div class="panel-body">
Past Posts
</div>
</div>
<p class="lead">News feed</p>
<ul>
<li>post 5</li>
<li>post 4</li>
<li>post 3</li>
<li>post 2</li>
<li>post 1</li>
</ul>
Nothing I know of will do this in notepad++.
You can't select multiple ranges of text, only a single continuous block of text. Unfortunately to delete text you have to select it and as there is no multiple range selection there is no way to perform the desired deletion.
There are plugins that can find the matching tag and changing language to HTML will also highlight the matching tag. This will let you easily see the location of the matching tag, but you will still have to select and delete the matching tag manually.

netbeans macros - quote completion

I have this netbeans macro, that simply outputs some html :
"<div class=\"kbox\">"insert-break
" <div class=\"title\"></div>"insert-break
" <div class=\"hide\">"insert-break
" </div>"insert-break
"</div>"insert-break
The problem is that when I fire the macro, I get :
<div class=""kbox>
<div class=""title toggle_div"></div>
<div class=""hide">
</div>
</div>
The quotes autocompletion fires on the macro output and the css class names end up outside their quotes... Is there a way to stop this behaviour for macros? I don't want to turn off autocompletion...
Using Netbeans 7.4
Put delete-previous after the double quotes.
In my code it looks like this:
"[<span class=\"" delete-previous
So you put one quote mark netbeans automaticaly adds second and then you delete it.

Org-mode: protect emphasis

How could I protect emphasis like italics or code within Emacs org-mode
when I have things like
/cologne/dome/
or
=<pre language="python">=
?
The following org-block demonstrates which parts work by default and which need a small amount of work-around to work.
The following was created using Org-mode version 7.8.03 (release_7.8.03.321.gaac1c). If you're using an older version it is possible that the behaviour is slightly different.
See Literal Examples and Monospace in the Org-Manual for full details
ORG
* Italics
- Your example simply works\\
/cologne/dome/
- It also works if your /example had / spaces within it/
- It will only fail if / your /have spaces on one end or the other /
* Code
Code blocks can be delimited in multiple ways:
** Inline formatting
- Using ~ for verbatim text works\\
~<pre language="python">~
- ~ renders the same as = for blocks =test= ~test~
** Code Blocks
- Single-line blocks
: <pre language="python">
- Multi-line blocks
#+BEGIN_EXAMPLE
asdf
#+END_EXAMPLE
HTML Export
<div id="outline-container-1" class="outline-2">
<h2 id="sec-1"><span class="section-number-2">1</span> Italics</h2>
<div class="outline-text-2" id="text-1">
<ul>
<li>Your example simply works<br/>
<i>cologne/dome</i>
</li>
<li>It also works if your <i>example had / spaces within it</i>
</li>
<li>It will only fail if / your /have spaces on one end or the other /
</li>
</ul>
</div>
</div>
<div id="outline-container-2" class="outline-2">
<h2 id="sec-2"><span class="section-number-2">2</span> Code</h2>
<div class="outline-text-2" id="text-2">
<p>Code blocks can be delimited in multiple ways:
</p>
</div>
<div id="outline-container-2-1" class="outline-3">
<h3 id="sec-2-1"><span class="section-number-3">2.1</span> Inline formatting</h3>
<div class="outline-text-3" id="text-2-1">
<ul>
<li>Using ~ for verbatim text works<br/>
<code><pre language="python"></code>
</li>
<li>~ renders the same as = for blocks <code>test</code> <code>test</code>
</li>
</ul>
</div>
</div>
<div id="outline-container-2-2" class="outline-3">
<h3 id="sec-2-2"><span class="section-number-3">2.2</span> Code Blocks</h3>
<div class="outline-text-3" id="text-2-2">
<ul>
<li>Single-line blocks
<pre class="example">
<pre language="python">
</pre>
</li>
<li>Multi-line blocks
<pre class="example">asdf
</pre>
</li>
</ul>
LaTeX Export
\section{Italics}
\label{sec-1}
\begin{itemize}
\item Your example simply works\\
\emph{cologne/dome}
\item It also works if your \emph{example had / spaces within it}
\item It will only fail if / your /have spaces on one end or the other /
\end{itemize}
\section{Code}
\label{sec-2}
Code blocks can be delimited in multiple ways:
\subsection{Inline formatting}
\label{sec-2-1}
\begin{itemize}
\item Using \~{} for verbatim text works\\
\verb~<pre language="python">~
\item \~{} renders the same as = for blocks \texttt{test} \verb~test~
\end{itemize}
\subsection{Code Blocks}
\label{sec-2-2}
\begin{itemize}
\item Single-line blocks
\begin{verbatim}
<pre language="python">
\end{verbatim}
\item Multi-line blocks
\begin{verbatim}
asdf
\end{verbatim}
\end{itemize}
I guess you want to output the original /cologne/dome/, but not <i>cologne/dome</i>, right?
Two ways:
set #+OPTIONS: *:nil to turn off all emphasis symbols
modify org-emphasis-alist, remove the relevant items
I also asked a similar question here: How do I escape slash in org-mode?