Sublime（および Atom）スニペット

スニペットは、再利用可能な コードを テキスト エディタにドロップするだけです。

簡単なコードを入力し始めると ポップアップが表示され 希望のスニペットを入力して Enter キーを押すと、 学びます。

唯一留意すべき点は、スニペットは、実行したファイルが 編集には特定の拡張子（JavaScript スニペットは （.js で終わるファイルの編集時）

JS と NodeJS のスニペット

荘厳 |Atom

JavaScript と NodeJS のスニペット パッケージ Zeno Rocha による、シンプルなスニペットの優れたパッケージです。 一般的な JavaScript を簡単に記述できます。

短縮コードとそれによって生成されるコードの例を以下に示します。

ae（イベント リスナーの追加）

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

cel（要素を作成）

document.createElement(elem);

cdf（ドキュメントフラグメントを作成）

document.createDocumentFragment(elem);

pr（プロトタイプ）

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

iife（すぐに呼び出される関数式）

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

Ben Alman による iife's Matter だけです

Zeno で使用可能なコマンドの一覧は github にあります リポジトリ（およびパッケージ できます。

ES2015 ツールキット

荘厳

ES2015（別名 ES6）は素晴らしく、最も優れた機能を備えており、スニペットがあります。 用意しています

このパッケージとそのスニペットを使用するには、 Babel（NPM 経由）。

npm install -g babel

また、一部の省略形コードの先頭にある大文字も念頭に置いてください。

Promise

Promise((resolve, reject) => {

});

クラス

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

  // methods
}

オブジェクト

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

サポートされているスニペットの全一覧については、Sublime パッケージをご覧ください。 コントロール ページをご覧ください。

残念ながら、このパッケージは Atom では利用できません。最も近いもの このパッケージは 「es6-javascript」

Polymer と Web Component Package

荘厳 |Atom

Polymer のボイラープレートを Mr. Dodsons の優れた Polymer およびウェブ コンポーネント スニペットです。

hi（HTML Import）

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

pe（ポリマー要素）

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

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

React スニペット

荘厳 | Atom

最後に、React ファン向けのパッケージをご用意しています。スキャフォールド コンポーネントとよく記述されるコードをこれらのスニペットに組み込みます。

rcc（クラス コンポーネント スケルトン）

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

var  = React.createClass({

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

});

module.exports = ;

scu（shouldComponentUpdate）

shouldComponentUpdate: function(nextProps, nextState) {

},

小物

this.props.

state

this.state.

MOAR パッケージ

さまざまなタイプのスニペットを提供するパッケージが他にも多数あります。 同じコードを何度も書いているのであれば、 誰かがそのパッケージを作成したとしても 編集するには、パッケージ管理でエディタを検索します。 （Sublime | Atom）。