##活用するメリット
-
clickEvent() =>
などの、記述が長く、クセのある構文が、改行込みで設定可能 -
console.log()
など使用頻度の高いメソッドを、任意のキーワードで素早く呼び出せる -
文字列の空白
も調整可能。 -
設定は、
基本設定 → ユーザースニペット → 検索窓[javascript.json]
##【Javascript.json】
"clickEvent": {
"prefix": ".adc", //.adcと入力すれば、"body"の中身が出力される
"body": [
".addEventListener('click', () => {",
" $1", //[$1] = スニペット実行後、始めにカーソルが当たる位置を指定。 $2 も設定可能
"});"
],
},
##【JavaScript】
const button = document.querySelector('button'); //button要素を取得
// button に続けて .abcと打てば、入力補完に、「ユーザースニペット」が出現。
button
//確定をすると、
button.addEventListener('click', () => {
//字下げ + カーソルがここに当たっている。
});
コチラに詳しく載ってます
[参考:lisz-works] https://www.lisz-works.com/entry/vscode-snippets
[参考:スニペット作成] https://vscode-doc-jp.github.io/docs/userguide/userdefinedsnippets.html