業界トップクラスの求人数を誇る転職エージェントPR

リクルートグループのコネクションを活かした非公開求人も充実、他にはない好条件の求人と出会える

86
39

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 5 years have passed since last update.

EmmetをJSX内で利用する方法(VSCode)

Last updated at Posted at 2019-07-15

概要

VSCodeは初期設定の状態でもEmmetが使えるようになっていますが、JSX内では下記のように使用できない。

初期設定でdivタグ入力時
スクリーンショット 2019-07-16 0.02.15.png

設定を変更して、emmetを機能するようにしていきます。

設定

1.設定を開く

VSCode内で
Mac: Command + ,
Windows: Ctrl + ,

2.設定変更

下記の手順で設定変更

①拡張機能
②Emmet
③setting.jsonで編集

UNADJUSTEDNONRAW_thumb_5.jpg

setting.jsonに設定を追加

setting.json
{
  "emmet.includeLanguages": {
     "javascript": "javascriptreact"
  }
}

これでdivを入力後tabを押すと以下のようになります。
n52og-b8vsz.gif

以上です。

86
39
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

Qiita Conference 2025 will be held!: 4/23(wed) - 4/25(Fri)

Qiita Conference is the largest tech conference in Qiita!

Keynote Speaker

ymrl、Masanobu Naruse, Takeshi Kano, Junichi Ito, uhyo, Hiroshi Tokumaru, MinoDriven, Minorun, Hiroyuki Sakuraba, tenntenn, drken, konifar

View event details
86
39

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?