VSCodeがHTMLを自動補完しない

87

Windows7に新しくインストールしたVisualStudio Codeで問題が発生しました。Macではエディターは自動的にhtmlタグを閉じますが、Win7では閉じません。オンにするためのオプションがあるはずだと思いますが、見つかりません。

私が話しているのは、例えば。<htmlintelliSenseの書き込みがポップアップし、Enterをクリックします。通常、自動的に</html>鉱山が機能しなくなります。（IntelliSenseがポップアップ表示されますが、あなたはオプションのいずれかを選択するときには、近くに自動タグません。<h1> -> </h1>）

html intellisense visual-studio-code

— Harvey3589661
ソース

1.自動クローズタグを使用でき、要件を満たすことができます。

— jialin wang 2017

2

2. divなどのタグ名を入力し、Tabキーを2回入力すると、whoeタグがオートコンプリートされます-----> <div> </ div>

— jialin wang 2017

42

0.3.0のリリースノート

タグのHTML自動クローズが削除され、よりスマートなIntelliSenseに置き換えられました</。

— ジョン・パパ
ソース

5

ああ、それは私が望んでいたことではありません。それを取り戻す方法はありますか？いくつかのファイルを変更するか、何かをダウンロードしますか？VSCodeを使用したいのですが、オートコンプリートがあります。ありがとう。

— Harvey3589661 2015年

56

私もこれを探していましたが、0.10.6でタブが機能することに気づきました。たとえば、div（なしで<>）と入力し、すぐにTabキーを押すと、になり<div></div>ます。まったく同じではありませんが、役立つ場合があります。これらのショートカット（emmet）のDocoはこちら

— peterc 2015

3

はい、それはエメットによるものです。Emmetでは、中括弧なしで要素名を入力すると、必要なものが追加されます。それは本当に強力です。

— ジョン・パパ

1

これは、VS Code1.5.3では機能しません。<div>と入力すると、</タグが閉じたり完了したりしません。ここで欠けているものはありますか？

— Michael Giovanni Pumo 2016年

2

最新の更新後は、入力divせずに<>Tabキーを押すだけでは、機能しなくなります。これを再度有効にする方法はありますか？

— ココドコ2017

173

タグ名を（開始せずに<）入力し、Tabキーを押します

たとえば、入力してdivからTabキーを押すと、VSはそれをに変換します<div></div>

または、開始タグを入力してからTabキーを2回押します

例えば：

タイプ <div
Tabキーを押します
Tabキーを押します

終了タグが追加されます

— ラボルフ
ソース

2

自己終了タグ（<input />など）はどうですか？

— ランドールフラッグ2016

1

inputと入力し、Tabキーを2回押すだけで、VSCodeは<

— inputtype

1

これはEmmet機能の一部であり、タグペアだけでなく、より複雑なHTML構造を簡単に生成できることを付け加えておきます。たとえば、これを読むか、Emmetをグーグルで検索することができます。

— Alex Che

@Rabolf VS Code用の他のクールなHMTLショートカットについて言及できますか？

— eMad 2017年

@eMAD残念ながら、私はVS Codeを使い続けませんでした

— Rabolf 2017年

56

同じ問題が発生していましたが、vs codeの右下に何かが表示されました。HTMLを使用する代わりにDjango-HTMLを使用していたので、言語をhtmlに変更しました。Boomはすべて正常に動作しています。画像を見る

— Siphamandla Hero Ngwenya
ソース

同様の問題がありましたが、私の場合、HTMLをPHPファイルに書き込んでいることに気付きました。私がいる限り、自動終了タグを使用できないと仮定します。

— プロメテウス

1

変更言語に必須ではありません、のみsettings.json "emmet.includeLanguages"に追加する：{ "ジャンゴ-HTML"： "HTML"}

— raultedesco

上記の@raultedescoコメントのおかげで、TwigテンプレートがHTMLを理解しない問題を修正しました。Ctrl+Shift+p->開くPerferences: Open Settings (UI)->検索includedLanguages-> Emmetの含まれる言語が見つかりました->入力Item: twig; Value: html->押すAdd item->お楽しみください

— バレンタイン市

22

ここにクールなトリック（実際にはEmmetの略語）があります：

タグ名を書く| 例えばh1
その後にアスタリスクを追加します| 例えばh1*
押す | （結果は）Tab<h1></h1>

_{PS： -これはまたのような、自己終了タグのために働くinput、imgなど}

— ɢʀᴜɴᴛ
ソース

1

@Kokodokoはい、それはありません :P

— ɢʀᴜɴᴛ

それは...私はそれを再度有効に変更する設定かわからないんだけど.....とても奇妙だ

— Kokodoko

1

@Kokodokoemmet拡張機能をインストールする必要があります。

— sudhanshu 2017

1

これは機能しますが、を含める必要はありません*。1.21.0

— ソース

1

@BlueCloudsはい、htmlの省略形のサポートを提供するものはすべて機能するはずです。一般的なルールでは、最大インストール数のものを使用します。

— Sudhanshu

15

この拡張機能をVSCodeで試すことができます。自動クローズタグ機能が実装されており、要件を満たします。

開始タグの終了括弧を入力すると、終了タグが自動的に追加されます
終了タグが挿入された後、カーソルは開始タグと終了タグの間にあります

— ジュンハン
ソース

これが私が必要としていたものです。今はブラケットのように機能します。これは素晴らしいことです。ありがとう！

— Harvey3589661 2016年

ええ、でも...以前のバージョンのVSCodeで有効になりました。これは、settings.jsonの迷路のどこかにある単なる設定ではありませんか？

— ココドコ2017

7

HTMLファイルの編集中に、Mac Sierra（10.12.6）とVSCode（1.30.2）で同じ問題が発生しました。vscodeのドキュメントhttps://code.visualstudio.com/docs/languages/htmlによると、インテリセンスはそのままで機能するはずです。

「言語検出」（画面下部のエディタステータスバーの右隅）が自動検出に設定されており、ファイルがとして認識されていることが判明しましたdjango-html。手動でプレーンHTMLに戻すと、すべてが機能します。

— XX
ソース

5

押してCtrlキー+ Shiftキー+ Pは、コマンドパレットを開きます。
サーチャーに「言語モードの変更」と入力します。
「言語モードの変更」を選択します。
サーチャーに「HTML」と入力します。
そして、「HTML」を選択します（おそらく「django-html」に設定されています）

— カピ
ソース

3

押す 𝐜𝐭𝐫𝐥+𝐬𝐡𝐢𝐟𝐭+𝐏->をて𝐂𝐡𝐚𝐧𝐠𝐞𝐋𝐚𝐧𝐠𝐮𝐚𝐠𝐞𝐌𝐨𝐝𝐞->を入力し、𝐀𝐮を選択します

わたしにはできる。

— suvalakshmi
ソース

1

この回答には新しいものは何もありません

— DoubleExpresso20年

2

[ファイル]> [設定]> [キーマップ]、[検索]、[自動閉じる]、[インストール]の順にクリックします。動作しない場合は、プラグインをリロードしてください。

— Dheemanth Bhandarkar
ソース

1

私は同じ問題に苦しんでいました、それから私はJavaScript（SE）拡張機能と一緒にVS Codeから不要な拡張機能をアンインストールしました、そしてそれは私のために働きました。

— 5hifaT
ソース

0

を押しCtrl + Shift + Pてコマンドを開きます。次に、Change Language ModeselectHTMLまたはその他の目的の言語を入力します。

— アリ
ソース

0

vscodeの下部を確認し、言語モードをHTMLに変更するだけです。django-htmlが表示されているか、ctrl + shift + pをクリックして言語モードを変更します。スクリーンショット

[！] + TABをクリックしてください。

— オトボン
ソース

0

入力した場合

div.class

次にTabキーを押すと、VSコードは指定されたCLASSのDIVタグを自動的に閉じます

しかし、ENTERを押してこの操作を実行したいと思いますキーを。

その場合は、VS Codeユーザー設定に移動して、次のコードを貼り付けます。

"emmet.includeLanguages": {
    "javascript": "javascriptreact",
    "vue-html": "html",
    "razor": "html",
    "plaintext": "jade"
}

今入力すると

div.class

＆次にENTERを押しますキーを押すと、魔法が見えます。

ただし、上記のコードは、通常のHTMLだけでなく、JSX of React、Vue.jsスニペットに対してもENTERキーを使用してVSCodeをオートコンプリートします。また、このことにより、カバーしますが。

ただし、HTMLファイルに対してのみ実行する場合は、次の行だけで十分です。

"emmet.includeLanguages": { "javascript": "html" }

乾杯..

— IFTEKHAR I ASIF
ソース