WebStorm syntax highlighting for Swig template engine - intellij-idea

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 :)

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.

.ejs files in Sublime default to file type "Plain Text"

I'm new to coding and I'm using the Express framework in Sublime.
When I create .ejs files, (for example footer.ejs) for some reason Sublime shows these files as Plain Text files, instead of .ejs files, even though I have NPM installed ejs.
Furthermore, when I click on "Plain text" in the bottom right of Sublime, EJS doesn't show up as an option.
My package.json shows that I have ejs installed: "ejs": "^2.5.9".
Does anyone know what I'm doing wrong? And how I can get .ejs files to automatically default to EJS instead of plain text? Thanks!
The short version of the answer to your question is that installing a package via npm doesn't have any effect on Sublime. In order to add support for EJS to Sublime you need to install a package for it in Sublime.
Package Control has a couple of packages, EJS and EJS 2 (and maybe also Hyperloop EJS, if that's a thing; I'm unfamiliar with EJS).
Just at first blush it seems like EJS 2 might be the better first bet; it's been more recently updated and is using the newer sublime-syntax syntax format and seems to support more things. Take that with a grain of salt though, since I have no experience with either one.
You can select the command Package Control: Install Package from the command palette and then select one of those packages to install it. If you're going to try them both, do it one at a time and use Package Control: Remove Package before installing the next one so that they don't compete with each other.
If those commands aren't in your command palette, you don't have Package Control installed yet. In that case you can select Install Package Control from the command palette to install PC first. If that doesn't work there are also instructions on how to install it manually.
Once you have a package installed, you can close and reopen the file to apply the correct syntax, or use the menu as you mention in your question.
Let's make it short and simple.
Syntax highlighting and auto completions are not great if you were to download ejs package.
Instead I recommend you to use html syntax highlighting.
Open Command pallet using ctrl+ shift + P or cmd + shift + P.
Set Syntax: HTML

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

PhantomJS/CasperJS IDE Helper

Is there any way to get IDE support for CasperJS functions? I am currently using PhpStorm, but also tried in netbeans, it won't know which functions are defined. It is quite irritating that I get Unresolved variable / undefined function IDE warnings for all the functions.
I tried to copy \casperjs\modules\*.js files to the project, most of the functions got "defined".
PhpStorm: Download the casperjs.zip from casperjs.org, it will contain a modules folder, copy every .js file to your project. (I put them in an IDE_HELPER folder)
An IDE helper javascript file would still be much better, but it is working.
Alternatively: You can also attach these files as external libraries, so it won't bother you while browsing your own files.
It should work in other IDEs too.
Disclaimer: I'm talking about JetBrains products.
I encountered this problem myself. The easiest way to solve it is to click on a bottom right icon (Finally, I understand that is this for!).
It will show you which libraries are associated with an open file. The only thing you have to do is to click on «Libraries in scope» and add your library by clicking «Download»
I know it's an old post, but after not finding any IDE Helper too I managed to write a script that creates one by scraping the content off of the official docs. You can find out more about the IDE Helper on my website:
http://christophersax.com/2016/casperjs-ide-helper/
(It's free of course)
I hope it helps!
You can add casperjs as a Resource in your Preferences.
Go to Project > Directories > + Add Content Root > Add casperjs folder then > Mark as Resource Root.

LiveReload not compiling SASS

I'm currently using the OSX app LiveReload v2.1. It watches and compiles my HAML files just fine but for some reason it doesn't seem to compile my SASS files properly. It checks my SASS files - I know because it warns me of SASS related errors upon saving. It also creates the appropriate CSS files upon saving the SASS files however, when I open the CSS files they are completely blank.
I'm a bit of a SASS n00b but I'm just trying to get any basic styling to compile down to proper CSS. For example, the following:
body
background-color:blue
Any pointers on what I might be doing wrong would be much appreciated. Also, I should point out that I also manually installed the SASS gem, just in case, though that didn't seem to fix anything.
I figured it out. It didn't have to do with LiveReload at all, but instead how my SASS was formatted. There needed to be a space between the attribute and value. For example:
body
background-color:blue
Should have been:
body
background-color: blue
It would have been nice if SASS pointed this error out rather than simply spitting out an empty CSS file, oh well.