Skip to content

An extensive set of javascript live templates for use with JetBrains IDEs.

License

Notifications You must be signed in to change notification settings

giuseppeminnella/js-live-template

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

45 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Table of Contents

Join the chat at https://gitter.im/js-live-template/Lobby

  1. Description
  2. Documentation
  3. Installation

Description

An extensive set of Javascript live templates for use in JetBrains IDEs. These live templates are based off of https://atom.io/packages/es6-javascript.

Documentation

Live Template Short Hand Description Template
v Declarations: var statement
var $name$;                
ve Declarations: var assignment
var $name$ = $value$;                
l Declarations: let statement
let $name$;                
le Declarations: let assignment
let $name$ = $value$;                
co Declarations: const statement
const $name$;                
coe Declarations: const assignment
const $name$ = $value$                
cos Declarations: const symbol
const $name$ = Symbol('$name$');                
if Flow Control: if statement
if ($condition$) {
  $END$
}                
el Flow Control: else statement
else {
  $END$
}                
ife Flow Control: if else statement
if ($condition1$) {
  $then1$
} else {
  $then2$
}                
ei Flow Control: else if statement
else if ($condition$) {
  $end$
}                
fl Flow Control: for loop
for (let $index$ = 0; $index$ < $iterable$.length; $index$++) {
  $END$
}                
fi Flow Control: for in loop
for (let $key$ in $source$) {
  if ($source$.hasOwnProperty($key$)) {
    $END$ 
  }
}                
fo Flow Control: for of loop (ES6)
for (let $key$ of $source$) {
  $END$
}                
wl Flow Control: while loop
while ($condition$) {
  $END$
}                
tc Flow Control: try/catch
try {
  $try_body$
} catch ($error$) {
  $catch_body$
}                
tf Flow Control: try/finally
try {
  $try_body$
} finally {
  $finally_body$
}                
tcf Flow Control: try/catch/finally
try {
  $try_body$
} catch ($error$) {
  $catch_body$
} finally {
  $finally_body$
}                
f Functions: anonymous function
function ($arguments$) { $END$ }                
iife Functions: immediately-invoked function expression (IIFE)
(($arguments$) => {
  $function_body$
})($passed_arguments$);                
fa Functions: function apply
$fn$.apply($context$, $arguments$);                
fc Functions: function call
$fn$.call($context$, $arguments$);                
fb Functions: function bind
$fn$.bind($context$, $arguments$);                
af Functions: arrow function (ES6)
($arguments$) => $statement$                
afb Functions: arrow function with body (ES6)
($arguments$) => {
  $END$
}                
gf Functions: generator function (ES6)
function* ($arguments$) {
  $END$
}                
gfn Functions: named generator function (ES6)
function* $name$ ($arguments$) {
  $END$
}                
fe Iterables: forEach loop (chainable)
$iterable$.forEach(($item$)) => {
  $END$
});                
map Iterables: map function (chainable)
$iterable$.map(($item$)) => {
  return $END$
});                
reduce Iterables: reduce function (chainable)
$iterable$.reduce(($previous$, $current$) => {
  return $body$
}, $initial$);                
filter Iterables: filter function (chainable)
$iterable$.filter(($item$) => {
  // return true to remove item from collection
  $END$
});                
find Iterables: ES6 find function (chainable)
$iterable$.find(($item$) => {
  // return true to find single item if it is in the collection
  $END$
});                
c Objects and classes: class (ES6)
class $name$ {
  constructor($arguments$) {
    $END$
  }
}                
cex Objects and classes: child class (ES6 syntax)
class $name$ extends $base$ {
  constructor($arguments$) {
    super($arguments$);
    $END$
  }
}                
cf Objects and classes: class function (ES6 syntax)
$fn_name$($arguments$) {
  $END$
}                
kv Objects and classes: key/value pair
$key$: $value$                
m Objects and classes: method (ES6 syntax)
$method$($arguments$) {
  $END$
}                
set Objects and classes: setter (ES6 syntax)
set $property$($value$) {
  $END$
}                
proto Objects and classes: prototype method (chainable)
$class$.prototype.$method_name$ = function ($arguments$) {
  $END$
};                
r Returning values: return
return $value$;                
rth Returning values: return this
return this;                
rn Returning values: return null
return null;                
rt Returning values: return true
return true;                
rf Returning values: return false
return false;                
r0 Returning values: return 0
return 0;                
r-1 Returning values: return -1
return -1;                
rp Returning values: return Promise (ES6)
return new Promise((resolve, reject) => {
  $END$
});                
S Types: String
String                
N Types: Number
Number                
O Types: Object
Object                
A Types: Array
Array                
D Types: Date
Date                
Rx Types: RegExp
RegExp                
tof Types: typeof comparison
typeof $source$ === '$type$';                
iof Types: instanceof comparison
$source$ instanceof $object$                
p Promises: new Promise (ES6)
new Promise((resolve, reject) => {
  $END$
});                
then Promises: Promise.then (chainable)
$promise$.then(($value$) => {
  $END$
});                
catch Promises: Promise.catch (chainable)
$promise$.catch(($err$) => {
  $END$
});                
ex ES6 modules: module export
export $member$;                
import ES6 modules: module import
import $END$ from '$module$';                
ima ES6 modules: module import as
import $exposed$ as $name$ from '$module$';                
imn ES6 modules: named module export
import { $name$ } from '$module$';                
desc BDD testing (Mocha, Jasmine, etc.): describe
describe('$description$', () => {
  $END$
});                
ita BDD testing (Mocha, Jasmine, etc.): asynchronous "it"
it('$description$', (done) => {
  $END$
});                
bef BDD testing (Mocha, Jasmine, etc.): before
before(() => {
  $END$
});                
befe BDD testing (Mocha, Jasmine, etc.): before each
beforeEach(() => {
  $END$
});                
after BDD testing (Mocha, Jasmine, etc.): after
after(() => {
  $END$
});                
afte BDD testing (Mocha, Jasmine, etc.): after each
afterEach(() => {
  $END$
});                
cl Console: console.log
console.log('$title$', $value$);                
cll Console: console.log (text only)
console.log($END$);                
ce Console: console.error
console.error($END$);                
cw Console: console.error
console.warn($END$);                
st Timers: setTimeout
setInterval(() => {
  $END$
}, $delay$);                
si Timers: setInterval
setTimeout(() => {
  $END$
}, $delay$);                
sim Timers: setInterval
setImmediate(() => {
  $END$
});                
ae DOM specifics: addEventListener
$document$.addEventListener('$event$', function(e) {
  $END$
});                
gi DOM specifics: getElementById
$document$.getElementById('$id$');                
gc DOM specifics: getElementByClassName
Array.from($document$).getElementsByClassName('$class$');                
gt DOM specifics: getElementByClassName
Array.from($document$).getElementsByTagName('$class$');                
qs DOM specifics: querySelector
$document$.querySelector('$selector$');                
qsa DOM specifics: querySelectorAll
$document$.querySelectorAll('$selector$');                
cb Node.js specifics: Node.js style callback
(error, $value$) => { $END$ }                
re Node.js specifics: require a module
require('$module$');                
em Node.js specifics: export member
exports.$name$ = $value$;                
me Node.js specifics: module.exports
module.exports = $name$;                
on Node.js specifics: attach an event handler (chainable)
$emitter$.on('$event$', $arguments$) => {
  $END$
});                
us Miscellaneous: use strict
'use strict';                
fn Functions: named function
function $name$($arguments$) {
  $END$
}                

Installation

macOS

There are two ways to install:

Using settings.jar

  1. File > Import Settings
  2. Select the settings.jar file
  3. Check Live templates in the Select Components to Import dialog
  4. Click ok in the Select Components to Import dialog
  5. Click ok when prompted to restart

Copying es6.xml

Put es6.xml inside of the following directory:

~/Library/Preferences/<intellij-product-install>/templates

About

An extensive set of javascript live templates for use with JetBrains IDEs.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • HTML 72.7%
  • JavaScript 27.3%