Format HTML code in IntelliJ - intellij-idea

When working with Java, Ctrl+Alt+L formats your highlighted code. Is there such a command when working with non-Java files like HTML? The same command doesn't work with HTML.

In Ultimate edition same keys (Ctrl+Alt+L) works for HTML as well. I suppose, community Edition doesn't support it out of the box.
Check settings: Settings -> Editor -> Code Style -> HTML (If it is not present, try to install some plugins for HTML support)

For Mac
Use Option+Command+L for Formatting HTML files.
You can check/customize it using:
command+, for a search for Reformat Code.

Use Ctrl+Alt+S for Formatting HTML files.

Related

How to format markdown and all code in it?

I have a bunch of markdown files in my github repo. As there are many members in the team, the syntax of markdown and code in markdown files are hard to be standardised.
What I want is:
Create a github action that modify those files automatically when there is a push.
I can't find a markdown prettifier that format the code as well. (e.g. putting spaces around '=')
The solutions that I can think out of are:
Use a CLI tool that can do all the stuff
Use a tool for markdown, use a script to filter all code in it and parse it to anther tool
Send http requests to those online prettifier if such CLI tools do not exist
Note: I have Java, Cpp, Swift and more in my markdown.
Any solution for this? I will be appreciated if the script could be provided (if needed).
Thanks.
If those markdown files are located in a java project, you may try spotless.
For example, if you have a maven project, with spotless, just run mvn spotless:apply, it could fix all the styles / formatting issues of your markdown files automatically.

VSCode does not show HTML attributes in .vue files but shows in html files

I have spent 3 hours figuring out what's going on but could not find it out. I am new to HTML and intellisense help me know many attributes of a tag on the go. However, with .vue files html attributes are not being shown up.
a) Attributes being shown up in "index.html"
b) No attributes hints in "TodoItem.vue"
I have already installed Vetur, HTML CSS Support and Vue VSCode Snippets extension from marketplace.
First, install Vetur extension after that go to
File > Preferences > Settings
In the list find and open Extensions find Vetur, scroll down and find Template Interpolation Service (must be checked).
I found it.
you need to install this official extension to get tailwind css hints.
Tailwind CSS IntelliSense
everything will come true

Is there any Plugin available for VueJs in Netbeans 8.2

Netbeans 8.x intellisense doesn't identify VueJS tags. Is there any Plugin available for VueJs syntax highlighting or autofill support in Netbeans 8.x? If not, are there any work arounds?
.vue file is a kind of html file, you can add syntax highlighting in Netbeans :
Tools > Options > Miscellaneous > Files
Add a new file extension :
File Extension : vue
Associated File Type (MIME) : HTML Files (text/html)
Not perfect but it seems there is no plugin for this actually.
EDIT : Visual Studio Code has nice features for vuejs
There is a plugin but it is still in developtment: https://github.com/Zwaen91/vuejs-netbeans. Some problems with the mixed mimetype text/vue+html. Created a ticket here: https://issues.apache.org/jira/browse/NETBEANS-88
Very Easy Solution:
First time, I also faced this problem when I am working on Netbeans
8.2.x Finally I got solution.
If you opened a PHP Project and if your file's extenstion is .html than NetBeans will display warning. Very easy solution.
replace your .html extension to .php .
Problem will be solve.See Screenshot from my PC's Netbeans.
See my Screenshot, there is no warning. Because, I have used [.]php extension.
Thanks

WebStorm syntax highlighting for Swig template engine

Given:
The Swig template engine: http://paularmstrong.github.io/swig/
Webstorm has a plugin for it: Textmate bundles support
A Textmate bundle for Swig is available: https://github.com/paularmstrong/Swig.tmbundle
I expect I should be able to get Swig highlighting fixed, but I'm only getting half way.
Below is the resulted highlighting I get. The Swig code is highlighted as expected, but HTML is not highlighted anymore.
I've tried installing and enabling the HTML textmate bundle as well, but when both the HTML and the Swig bundle are activated, the code is highlighted as only HTML. If I disable the HTML bundle but have the Swig bundle still active, I only get Swig highlighting.
My Question: How do I get Swig code and HTML code highlighted in the same file in WebStorm on Windows?
Result:
This is my Textmate Bundles configuration in WebStorm 9:
Again, simply selecting the HTML bundle to enable it doesn't work.
Swig has nearly identical syntax to Twig, so we can assume they can be used interchangeably speaking of syntax highlighting and code completion.
The thing is that PHPStorm it has a Twig support throught a plugin (which is awesome BTW), but sadly it is not available in the others IDEs thought the Plugins menu.
This issue can be solved by:
manually downloading the plugin from the official repo at https://plugins.jetbrains.com/plugin/7303?pr=
then installing it manually thought the Plugin interface,
then or use the .twig extension on files or adding a new mapping in the File Types system menu for the type Twig, with wildcard *.html or *.swig, how you prefer.
I'm using the *.html workaround and work like a charm, both Swig & HTML syntax highlighting + code completion.
Hope this helps you like it did to me :)

Testing WebOdf Collaborative editor on localServer

I am trying to add document editor support in my website. I found Opensource WebODF and tried to test it on my local server. The git repository ReadMe gives instructions on how to add Odf viewer support.
I was able to test the localeditor. Can some one explain how to setup the collaborative editor on local server.
The brief steps are as follows :
Download the Wodo-TextEditor library from here.(It has the webodf library included as dependency).Put the library in your server or root directry of application,so you can access it from html page.
Then include the editor scripts in your html as done in sample html below.
Make sure you have a odt document on your server or you can use welcome.odt sample document included in Wodo-TextEditor library.
And load the editor as in sample or you can just pick the whole html as it is ,just make sure all your include paths are valid.
And that should be it !
You can refer this answer by me to setup a local webodf editor for your web application.
For simply using webodf editor you can use this html page sample .Make sure you have a odt document on your server directory which can be loaded in the editor.