Fragmentos de Sublime (y Atom)

Los fragmentos son fragmentos reutilizables de automático que puedes usar el editor de texto con facilidad y rapidez.

Comienza a escribir un código corto. Aparecerá una ventana emergente y solo tiene que presionar Intro en el fragmento que desea bloque de código.

El único problema que hay que tener en cuenta es que los fragmentos solo funcionan cuando el archivo está editando tiene una extensión específica (p.ej., los fragmentos de JavaScript solo funcionan cuando edites un archivo que termina en .js).

Fragmentos de JS y NodeJS

Sublime | Átomo

Los fragmentos de JavaScript y NodeJS paquete de Zeno Rocha es un gran paquete de fragmentos simples que te permiten escribir rápidamente código JavaScript común.

A continuación, se presentan algunos ejemplos de códigos abreviados y el código que producen:

ae (Agregar objeto de escucha de eventos)

document.addEventListener('event', function(e) {  
 // body...  
});

cel (Crear elemento)

document.createElement(elem);

cdf (Crear fragmento de documento)

document.createDocumentFragment(elem);

pr (prototipo)

ClassName.prototype.methodName = function(arguments) {  
 // body...  
}

iife (expresión de función invocada de inmediato)

(function(window, document, undefined) {  
 // body...  
})(window, document);

Esta es la publicación de Ben Alman sobre IIFE, solo para Matt.

Zeno tiene una lista completa de los comandos que puedes usar en github repo (y package páginas).

Kit de herramientas ES2015

Sublime

ES2015 (también conocido como ES6) es increíble, hay un fragmento que combina con él.

Para usar este paquete y sus fragmentos, asegúrate de instalar Babel a través de la NPM.

npm install -g babel

También toma nota de la mayúscula al comienzo de algunos de los códigos abreviados.

Promesa

Promise((resolve, reject) => {

});

clase

class Classname extends AnotherClass {
  constructor(args) {
    // code
  }

  // methods
}

objeto

var obj = {
  __proto__: theProtoObj,
  handler,
  toString() {
    return "object";
  }
}

Para ver una lista completa de los fragmentos admitidos, consulta el paquete Sublime página Control.

Lamentablemente, este paquete no está disponible para Atom. El equivalente más cercano parece ser este paquete titulado “es6-JavaScript”.

Paquete de Polymer y componentes web

Sublime | Átomo

Reduzca su esfuerzo escribiendo código estándar de Polymer con Mr de Polymer y componentes web de Dodson.

hi (importación de HTML)

<link rel="import" href="bower_components//.html">

pe (elemento de polímero)

<dom-module id="">
  <style>
    :host {
      display: block;
    }
  </style>
  <template>

  </template>
  <script>
    Polymer({
      is: ''
    });
  </script>
</dom-module>

Fragmentos de React

Sublime | Átomo

Por último, los fans de React también tienen un paquete para ustedes. Andamiaje componentes y el código comúnmente escrito con estos fragmentos.

rcc (esqueleto del componente de la clase)

var React = require('react');
var PropTypes = React.PropTypes;

var  = React.createClass({

  render: function() {
    return (
      <div />
    );
  }

});

module.exports = ;

scu (debeComponentUpdate)

shouldComponentUpdate: function(nextProps, nextState) {

},

objetos

this.props.

state

this.state.

Paquetes MOAR

Hay muchos otros paquetes que ofrecen fragmentos para diferentes {i>frameworks <i}de modo que, si tienes que escribir los mismos fragmentos de código una y otra vez, es probable que alguien haya escrito un paquete para ayudar a que eso sea algo del anterior, simplemente haz una búsqueda en el administrador de paquetes de tu editor (Sublime | Atom).