0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

VScode スニペット登録 【JavaScript】

Last updated at Posted at 2020-09-05

##活用するメリット:point_up:

  •   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', () => {
   //字下げ + カーソルがここに当たっている。
  });

:point_down:コチラに詳しく載ってます:point_down:
[参考:lisz-works] https://www.lisz-works.com/entry/vscode-snippets
[参考:スニペット作成] https://vscode-doc-jp.github.io/docs/userguide/userdefinedsnippets.html

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?