VSCodeでReactのjsxでhtmlタグが補完されないときのEmmet設定

VSCodeでReactのjsファイルを書いてるときに、htmlタグの候補（Emmet）を表示させる方法です。

「拡張子が.htmlのファイルでは、ちゃんとhtmlタグの候補が表示されるのに、javascriptの中に記述してる仕方ないのかな…」

とお困りの方は、こちらの設定をおすすめします。

なお、本記事ではMacでの手順を記載しています。

拡張設定でEmmetのInclude languagesを設定する

STEP

VSCodeの設定画面を表示する

メニューから「Code」→「基本設定」→「設定」を選択します。

STEP

拡張機能でEmmetのInclude Languagesを設定する

左メニューから「拡張機能」→「Emmet」を選択し、画面右をスクロールして「Include Languages」の項目を表示します。

「項目の追加」ボタンをクリックして、以下を追加します。

キー	値
javascript	javascriptreact

これでjavascriptファイル内でhtmlタグを入力したときに、入力候補（Emmet）が表示されるようになります。

新しい環境でVSCodeを使い始めるときなど、こちらの記事を参考に設定してみてくださいね！

それでは、楽しいプログラミングライフを！