I've been currently using the Brackets.io editor, and it has lots of extensions and so on, which is pretty good. Anyway, I couldn't find any extensions to do precisely what I want, so I came here in hope any of you guys could help me.
Well, as you know, on Netbeans, when you type a tag, such as P, the editor closes it, and if you then press ENTER, it automatically auto indents the code as the following:
<p>
Example
</p>
Is there a way to do so on Brackets.io, in the same, same way?
Thank you all for your attention :)
Emmet does that.
Typing the following keys < p > RETURN a does the following :
Without Emmet:
<p>
a</p>
With Emmet:
<p>
a
</p>
By the way, Emmet is a very cool tool, and you can obtain the same result faster with the following keys :
p TAB RETURN a
Related
Is there a way to edit the "autocomplete library" for CSS on Komodo Edit (I am on version 12.0)? Every time I am writing CSS code the autocomplete suggestion always comes up with undesired (not so common) terms.
For example:
When I start typing "#element { wid...."
Komodo suggests "WIDOW"!
But I want WIDTH!
When I start typing "#element { back...."
Komodo suggests "BACKFACE-VISIBILITY"!
But I want "BACKGROUND"!
I have no idea where in Komodo files I could remove the undesired terms to prevent its suggestion.
Thank you in advance!
G.
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.
I am working on vue file, but same problem happens when in javascript language mode.
When I paste in the following text,
<li><a
:class="{'toggle':true, 'layerOn':dispHandicappedParking}"
href="#"
#click.prevent="dispHandicappedParking =! dispHandicappedParking"
>Accessible Parking</a>
</li>
VS Code immediately autoformats it to the following:
< li > <a
: class="{'toggle':true, 'layerOn':dispHandicappedParking}"
href = "#"
#click.prevent="dispHandicappedParking =! dispHandicappedParking"
> Accessible Parking < /a>
< /li>
If I then hit "undo", the bad formatting is removed, but the pasted code stays (which in itself seems a strange behavior: I'd expect paste to be a one-step-undoable action).
What setting to I need to adjust in order to stop the editor from mangling my code?
Ok, was an extension: Vue Language Features. I guess that's what I get for installing a preview build and forgetting about it!
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.
In ST2 when you type div.foo and then press tab it goes to <div class="foo"></div>
Is there any setting to do autocompletion like that?
<div class="foo">
// 4spaces here.
</div>
Thank you.
UPDATED
Didn't find a special setting but found where to change snippet if someone intested.
In Sublime Text 2/Packages/HTML/html_completions.py just change
snippet = "<{0} class=\"{1}\">$1$0".format(tag, arg)
to
snippet = "<{0} class=\"{1}\">\n\t$1\n$0".format(tag, arg)
Solved.
You must be using emmet.... stock sublime text 2 does not auto complete class attribute from typing element.class that is emmet's doing. I use it... I love that emmet magic.
Similarly you could type element>element to make the second one nest on the first one. or element#id to add an id instead of a class...
Here is an entire cheat sheet for emmet for more completions using emmet plugin on ST2.
Make sure your page is on HTML. You can do this with CTRL+SHIFT+P. Then type 'set html'.
Then you can type div.class_name followed by TAB.