Skip to content

Instantly share code, notes, and snippets.

@tmkasun

tmkasun/README.md

Last active August 10, 2017 14:54
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save tmkasun/531138c2e63c320111a00a2052564cdd to your computer and use it in GitHub Desktop.
Save tmkasun/531138c2e63c320111a00a2052564cdd to your computer and use it in GitHub Desktop.
Download ZIP
javascript code snippets(live templates) for intellij
Raw
README.md

intellij javascript live templates

This is an improved version of this gist thsnks to ngryman I have added three new snippets creation of ES6 class, React Class Component and React Functional Component.

How install

  • Save below XML content to a file named custom_templates.xml.
  • Note: If you want to change the file name change the file name + group attribute in <templateSet group="custom_templates"> element as well.
  • Copy the custom_templates.xml file to ~IntelliJ IDEA{version}/config/templates
  • Vertify the settings by going to settings > Live Template and look for custom_templates goup
  • Read jetbrains docs for more info.
Raw
custom_templates.xml
<templateSet group="custom_templates">
<template name="forin" value="for (var $VAR$ in $ARRAY$) {&#10; $END$&#10;}" description="Iterate (for..in)" toReformat="true" toShortenFQNames="true">
<variable name="ARRAY" expression="jsArrayVariable()" defaultValue="&quot;array &quot;" alwaysStopAt="true" />
<variable name="VAR" expression="jsSuggestVariableName()" defaultValue="&quot;o&quot;" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="for" value="for (var $INDEX$ = 0, len = $ARRAY$.length; $INDEX$ &lt; len; $INDEX$++) {&#10; var $VAR$ = $ARRAY$[$INDEX$];&#10; $END$&#10;}" description="Iterate elements of array" toReformat="true" toShortenFQNames="true">
<variable name="INDEX" expression="jsSuggestIndexName()" defaultValue="&quot;i&quot;" alwaysStopAt="true" />
<variable name="ARRAY" expression="jsArrayVariable()" defaultValue="&quot;array&quot;" alwaysStopAt="true" />
<variable name="VAR" expression="decapitalize(jsArrayVariable())" defaultValue="&quot;a&quot;" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="rfor" value="for (var $INDEX$ = $ARRAY$.length - 1; $INDEX$ &gt;= 0; $INDEX$--) {&#10; var $VAR$ = $ARRAY$[$INDEX$];&#10; $END$&#10;}" description="Iterate elements of array in reverse order" toReformat="true" toShortenFQNames="true">
<variable name="INDEX" expression="jsSuggestIndexName()" defaultValue="&quot;i&quot;" alwaysStopAt="true" />
<variable name="ARRAY" expression="jsArrayVariable()" defaultValue="&quot;array&quot;" alwaysStopAt="true" />
<variable name="VAR" expression="decapitalize(jsArrayVariable())" defaultValue="&quot;o&quot;" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="m" value="$CLASS$.prototype.$FN$ = function($PARAMS$) {&#10; $END$&#10;};" description="Declare a method" toReformat="true" toShortenFQNames="true">
<variable name="CLASS" expression="jsQualifiedClassName()" defaultValue="&quot;Class&quot;" alwaysStopAt="true" />
<variable name="FN" expression="jsMethodName()" defaultValue="&quot;fn&quot;" alwaysStopAt="true" />
<variable name="PARAMS" expression="" defaultValue="&quot;param&quot;" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="ctor" value="var $CLASS$ = function($PARAM$) {&#10; $END$&#10;};" description="Declare a constructor" toReformat="true" toShortenFQNames="true">
<variable name="CLASS" expression="" defaultValue="&quot;Class&quot;" alwaysStopAt="true" />
<variable name="PARAM" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="if" value="if ($COND$) {&#10; $END$&#10;}" description="If ..." toReformat="false" toShortenFQNames="true">
<variable name="COND" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="ifel" value="if ($COND$) {&#10; $END$&#10;}&#10;else {&#10; &#10;}" description="If ... Else ..." toReformat="false" toShortenFQNames="true">
<variable name="COND" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="ter" value="$COND$ ? $EXPR$ : $END$;" description="Ternary operator" toReformat="false" toShortenFQNames="true">
<variable name="COND" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="EXPR" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="scl" value="(function() {&#10; $SELECTION$&#10;})();" description="Closure" toReformat="true" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="cl" value="(function() {&#10; $END$&#10;})();" description="Closure" toReformat="true" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="sp" value="$PROP$: $VAL$, $END$" description="Declare a property" toReformat="true" toShortenFQNames="true">
<variable name="PROP" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="VAL" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="f" value="function $FN$($PARAMS$) {&#10; $END$&#10;};" description="Declare a function" toReformat="true" toShortenFQNames="true">
<variable name="FN" expression="jsMethodName()" defaultValue="&quot;fn&quot;" alwaysStopAt="true" />
<variable name="PARAMS" expression="" defaultValue="&quot;param&quot;" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="t" value="this.$PROP$;&#10;$END$" description="this" toReformat="true" toShortenFQNames="true">
<variable name="PROP" expression="completeSmart()" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="so" value="{ sp$END$ };" description="Declare a literal object" toReformat="true" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="o" value="{&#10; p$END$&#10;};" description="Declare a literal object" toReformat="true" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="p" value="$PROP$: $VAL$,&#10;$END$" description="Declare a property" toReformat="true" toShortenFQNames="true">
<variable name="PROP" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="VAL" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="clog" value="console.log($END$);" description="console.log" toReformat="true" toShortenFQNames="true">
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="it" value="it('should $WHAT$', function(done) {&#10;&#9;$END$&#10;});" description="It should..." toReformat="false" toShortenFQNames="true">
<variable name="WHAT" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="on" value="on('$EVT$', function(e) {&#10;&#9;$END$;&#10;});" description="On event" toReformat="false" toShortenFQNames="true">
<variable name="EVT" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="pf" value="$FN$: function($PARAMS$) {&#10; $END$&#10;}" description="Declare a property function" toReformat="true" toShortenFQNames="true">
<variable name="FN" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="PARAMS" expression="" defaultValue="&quot;param&quot;" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="desc" value="describe('$WHAT$', function() {&#10;&#9;$END$&#10;});" description="Describe..." toReformat="false" toShortenFQNames="true">
<variable name="WHAT" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="class" value="class $NAME$ {&#10; constructor($PARAMS$) {&#10; $END$&#10; }&#10;}" description="Add ES6 class" toReformat="true" toShortenFQNames="true">
<variable name="NAME" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="PARAMS" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="rcc" value="import React, {Component} from 'react';&#10;&#10;class $CLASSNAME$ extends Component {&#10; constructor($PROPS$) {&#10; super($PROPS$);&#10; $CONST$&#10; }&#10; &#10; render() {&#10; $END$&#10; }&#10;}" description="Initialize react class component" toReformat="true" toShortenFQNames="true">
<variable name="CLASSNAME" expression="" defaultValue="" alwaysStopAt="true" />
<variable name="PROPS" expression="" defaultValue="props" alwaysStopAt="true" />
<variable name="CONST" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
<template name="rfc" value="import React from 'react';&#10;&#10;const $FUNCNAME$ = (props) =&gt; {&#10; return ($END$);&#10;};&#10;&#10;export default $FUNCNAME$" description="Initialize React functional component" toReformat="true" toShortenFQNames="true">
<variable name="FUNCNAME" expression="" defaultValue="" alwaysStopAt="true" />
<context>
<option name="JAVA_SCRIPT" value="true" />
</context>
</template>
</templateSet>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment