Intellij multiple filetypes - intellij-idea

I'm using IntelliJ with the handlebars plugin. One of the nice things about this plugin is the code assist. However, the only way to get this functionality is by assigning html file type to handlebars, so I lose all the features of having .html files associated with HTML default for IJ. Is there any way to have html files associated to both the handlebars AND HTML?

Handlebars is a template language. Currently IntelliJ doesn't support injection of template languages. It should help you. Please vote for http://youtrack.jetbrains.com/issue/IDEA-106449

Related

Prettier, is it possible to disable for a language?

I'm using Prettier with pretty-quick and do not agree with how it formats HTML. I know I can exclude by globs but can I exclude by language so that the HTML in my Vue files are untouched?
No. It's not possible. HTML is considered the "main language" of a .vue file, JS and CSS "embedded". You can only disable formatting for embedded languages by the --embedded-language-formatting off option. As for template tags, the only way to keep them unformatted is to put <!--prettier-ignore--> in front of each of them.

How to use vue2.0 attribute with Data-attribute

I am new to vue2, I am trying to learn and implement it inside our EPUB format. But the problem is that EPUB parser does to allow custom tags / custom components.
e.g. I cant use <li v-for="friend in friends"> in my HTML file as the parser will give error for v-for.
So I want to know if there is any way so that I can write whole vue2 code + tempalte inside .js and later append it to DOM?
Sure, with ES6's ` you can write templates including line breaks in a single string, and then assign the string to the template option.
However, you can use babel to transpile your code before the EPUB parser runs (so there won't be any v-for), check out the guide. And sure setting up the took chain require some effort, you can use the pure js option if your app is not too complicated.

IntelliJ (IDEA/Webstorm) ignore/accept custom templating tags in HTML documents

I am using custom seperators/tags for template variables in HTML code. My tags are "{[{" "}]}". Can I make IntelliJ IDEA (or WebStorm) ignore completely what is inbetween them? If it matters, it is Go template language with custom tags.
Example :
<div title="{[{.T.T "error"}]}!"></div>
Gets marked as error because of the quotes inside the quotes. It also disables the ability for proper auto indentation or code formatting.
Another example, in this case JavaScript in an HTML document :
<script>
{[{if .Data.User}]}
var userData = {[{.Data.User}]};
{[{end}]}
</script>
This marks the quotes themselves as error.
I don't want IntelliJ to check the template code, just ignoring everything between the brackets would be enough.
No, you can't. IntelliJ IDEA builds a complete parse tree for the entire file, and it is not able to ignore arbitrary chunks of the file.
What you can do is either write a plugin that will be able to parse your template syntax, or change the syntax you use so that it matches more closely an existing template library already supported by IntelliJ IDEA.

dojo internalize html templates

When using filter and pagination plugins for EnhancedGrid, the HTML templates for the same are loaded from dojox\grid\enhanced\templates.
Is there any way by which I can avoid the server requests for these HTML files by making them part of the Enhanced Grid's inline javascript?
You should make a custom dojo build that creates one js file as a result. follow this instructions from a previous QA:
How to build Dojo into a single file, given a list of dependencies?
EDIT:
The build should add those html files inline, but doesn't. I googled a bit and found this link related to your problem:
http://grokbase.com/t/dojo/dojo-interest/121e536t64/enhancedgrid-filter-problem
It suggests a fix using this link
http://dojo-toolkit.33424.n3.nabble.com/Custom-build-including-CSS-and-HTML-files-td3536573.html
Citation:
If you are using the AMD style of module definition, then you can specify a text dependency like so:
define(["dojo/text!some/file.html", "other/module"],
function(template, otherModule){
...
// to use the contents of the html file, treat template as if it were a normal string
someNode.innerHTML = template;
...
});
The build system should automatically convert the text dependency to an inline string literal. Most Dojo files are already formatted to use this feature, but I can't account for dojox modules. I'm not sure whether similar functionality is possible with the dojo.require/dojo.provide system of dependency declaration.
I have got the solution. Those struglling from this issue pls. note that there is bug with Dojo 1.7.1 and we need to use Dojo 1.8.3 and use internStrings option with the build command. You should see HTML files being interned in the build-report.

remove redundant css rules from dynamic website

I'm trying to reduce the size of my CSS file. It is from a template which is very CSS & JS heavy. Even with CSSMin the CSS file size is 250kb.
Whilst I use alot of the CSS - I know I dont use it all. So I'm trying to work out which styles can be removed. I'm aware of Dust-Me selector - but that only takes a static look at the website. With HTML5 and CSS3 - websites are now very dynamic, and most of my CSS occurs from dynamic events, or 'responsive' events i.e. Bootstrap.
Question: Is there a tool which 'records' all my CSS use on a website for a perioid of time, so I can go and click/hover/move over each element and interact with my site. Then at the end let me know which styles were & were not used?
CSS Usage is a great extension for firefox. It tells which css are currently used in a page.
Link: https://addons.mozilla.org/en-us/firefox/addon/css-usage/
There are two tools that I think might help you out.
helium is a javascript tool that will discover any unused css rules.
csscss is a source code analyzer that will report any duplication. I'm biased because I wrote csscss precisely because I couldn't find anything that did this. But many people seem to find it useful.
250kb is really such a big figure for just CSS files.
The templates generally have all the CSS required for all the pages in a single file.
I would suggest:
Do not cut your CSS code, they might be needed some point of time.
Instead i would suggest, break your CSS file into number of small files for different page stylings,
such as a different CSS for login page, different CSS file for home page, etc.
Read your own CSS and HTML code vigorously to find out which significant part of CSS code is used in which HTML section.
Update:
You may try Removed Unused CSS - CSS optimizer.
I personally did not use it just hope it works for you.