I am a beginner on the HTML format document.I just tried to use emmet like that in VSCode
".cal-row4>button.calc-button4 "
The result was like the image below.
However, I want to make the tags like the image below by using Emmet shortcuts.
It's pain in the ass to struggle with the tags and configuration for the buttons.
How can I change the settings in order to make my emmet configuration like that, when I entered a shortcut similar to my example.
I could not find how to fix it, if you know some plugins or setting to fix that, I am open to taking advice.
You should use a prettier - code formatter. It is the easiest way to format your code.
You will have to install it first and you can install it directly from the vs code.
Go to the Extensions tab and search for it and install it.
You can also configure it according to your need.
command for windows => Shift + CTRL + F
link https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
Related
first I created a project to work with django, but when I add index.html to it it doesn't autocomplete! When I type, nothing comes up, I also get an error like "This extension is deprecated because it is no longer maintained".
"!" in the html files of my codes.
When I put the tick I wanted autocomplete but it didn't happen and I searched a lot and couldn't find any result. I would be glad if you help.
Here is the following method for doing what you what to do.
open your vscode.
Go to setting and search emmet language in the search bar find it include the language and add a specific language.
After doing this save it and your vscode is ready to go.
I'm trying to setup PhpStorm, so I can simply press: "Reformat Code" ( Option CMD L), before each save - and then it'll make everything look right.
But I have this case, where I don't know how to make PhpStorm make the code right.
This is the code:
As you can see, then indentation is with tabs, but the aligning of the characters are with spaces.
I want it to look like this:
It would be cool to get the solution. But it would be even cooler to be able to figure out, how I could have found the solution myself.
Further info / idea: There is a Php Codesniffer from Squizlabs implemented. So I can fix is automatically by running a sniff fix-command. It would be pretty cool, to be able to automatically setup PhpStorm's Code style settings, to correspond with Squizlabs styles, without having to gradually tune the settings one thing at the time. But I haven't found that functionality.
Solution attempt 1: Read through all Settings >> Editor >> Code style >> PHP
I couldn't find anything that resembled this.
Solution attempt 2: Disable .editorconfig
I've read quite a bit about .editorconfig and it doesn't have these nitty-gritty functions here (as aligning equal signs).
But to make sure, I tried disabling it. Didn't make a difference.
Solution attempt 3: Search setting for 'align' and 'formatting'
But I didn't find anything useful. :-/
Solution attempt 4: Update PhpStorm
I was on PhpStorm version 2022.2.1.
I tried updating to PhpStorm version 2022.2.4.
This is still in progress.
Please show what you have at Settings (Preferences on macOS) | Editor | Code Style | PHP, specifically Tabs and Indents tab.
Checking Use tab character option with unchecked Smart tabs should do just that.
https://www.jetbrains.com/help/phpstorm/2022.3/settings-code-style-php.html#php-specific-formatting-settings-for-tabs-and-indents
(Pro tip: you can copy-paste your code sample in the preview area and start changing the options; the IDE will apply the changes live on the provided code sample instead of the default one.)
I recently switched from Brackets to VS Code and I can't find a specific keyboard shortcut that I used regularly on Brackets, and I can't custom create it because I don't know how to correctly describe the command to the program.
On Brackets I used to use the keyboard shortcut Shift+Ctrl+A and with a few lines selected it would let me format the complete selection. It opened a one-line command screen on the bottom and it would let me add up different tags for HTML for example. Let's say I had a few paragraphs that I needed to format into an ol, once selected I would simply type: ol>li* in the command screen and it would automatically format the whole selection.
English is not my first language so sorry if the explanation is kind of weird! I've been searching for a solution to this for some days and I'm getting nowhere.
Things I already tried/worth noting:
Installed the Brackets keymap extension (I went through all of the keybinds and couldn't replicate this)
Checked VSCode keybinds list.
I, unfortunately, uninstalled Brackets and can't take a screenshot of the thingy. I am regretting this so much already. I should have been more aware of the keyboard shortcuts and whatever extensions I had installed.
Maybe it has to do with an extension that I'm forgetting to install?
So version before 1.30 worked fine, and did close the Tags in .html file, but as of 1.30 update I can't finish and then try to close it with
I have tried to delete config.json file, also tried to turno on every possible option for auto-close and auto-complete tags in options, but nothing worked.
And Sublime it's working fine. I downloaded plugin to transfer Sublime confing into Visual Studio Code but without success. Hope you can help me out, since i've been trying to fix this problem 3 hours now.
I had the same problem, then I noticed that my select language mode was something like Django HTML. Solved after changing it.
You might have opened a file before that changed the language mode. So first, check the language shown at the bottom-right of the VS Code window (status bar), then follow the steps bellow.
Go to settings (or edit the settins.json file) and search emmet.includeLanguages, then press add item under Emmet: Include Languages. input the language you are using in item field and html in value field.
In one computer that i have if write html and press TAB it will head whole html layout, very convenient.
In other computer, it just adds <html> </html>.
So why i want it to behave like the first one.
It may not be just computer but how i setup files etc.
Nevermind, thanks to comment from Andrew, i have figured out that package called Emmet was messing this up but for good as it provides a better way to do things.
try html:5
http://coding.smashingmagazine.com/2013/03/26/goodbye-zen-coding-hello-emmet/
FWIW In case there are other snippets that you want to use that conflict with the Emmet plug-in:
Find the file html.sublime-snippet in the Packages Folder\HTML. Edit it and change the trigger from html to some other phrase that won't conflict with Emmet shortcuts.