web-dev-qa-db-ja.com

VS Code HTMLエラーチェック/検証

NetbeansからWeb開発のためにVisual Studio Codeに切り替えたばかりで、私の方法を見つけています。 Netbeansでは、タグ名の閉じ括弧を忘れると、赤の波線の下線でエラーを示し、左マージンにアラートが表示されます。

エラーチェックは、vsコードのようなWeb開発エディターの基本的な機能だと思っていました。たぶん、私はちょうど正しいオプションや拡張機能を見つけていません。

VS Codeでこれと同じhtml、cssエラーチェック動作を実現するにはどうすればよいですか？

htmlvisual-studio-code
12
Marc

VSCodeには、デフォルトではHTML検証がありません。ただし、拡張機能を追加してこれらの機能を有効にすることはできます。

HTML検証（リンティング）を追加するには、VSCodeを開き、Ctrl + Pそして貼り付けext install HTMLHintを入力し、Enterキーを押します。 HTMLバリデーターがインストールされます。拡張機能をロードするには、VSCodeをリロードする必要がある場合があります。

これで、構文エラーのあった同じHTMLドキュメントを開くと、下部のステータスバーに問題が表示されるはずです:)。また、それらの行にエラーが表示されます。

28
Nimeshka Srimal

VS Codeのデフォルトはコードのフォーマットをサポートし、構文エラーを追跡します。新しいファイルを作成して直接コードを記述しようとすると、VS Codeは、ユーザーがどの言語またはどのタイプの構文をフォーマット/修正したいかを理解できませんでした。したがって、最初にVisual Studioが構文を適切に識別するよりも、適切な拡張子で新しいファイルを保存する必要があります。

コードの書式設定は、VS Codeで次のショートカットを使用して利用できます。

  • Windows Shift + Alt + F
  • Mac Shift + Option + F
  • Ubuntuで Ctrl + Shift + I

あなたは付け加えられます Auto Close Tag VS Codeマーケットプレイスから。

VS Code Quick Open（Ctrl + P）を起動し、次のコマンドを貼り付けてEnterキーを押します。

  1. Visual Studio IDEまたはSublime Textと同じ）HTML/XML終了タグを自動的に追加します

    ext install auto-close-tag

  2. HTMLHintのVSコード統合-HTMLの静的コード分析ツール

    ext install HTMLHint

  3. ワークスペース内のCSSファイルに基づいて、HTMLクラス属性のCSSクラス名を補完します。 ReactのclassName属性もサポートします。

    ext install html-css-class-completion
4
eigenharsha

VSコードはデフォルトでこれをサポートしています。また、デフォルトでEmmetサポートが有効になっているため、HTMLタグを閉じることを心配する必要はありません。終了タグが自動的に追加されます。

1
Ganesh

これは、VsCodeの組み込み機能ではありません...ただし、利用可能な多くのプラグインがあります。 HTMLHintプラグインをお勧めします。それが私が使ってきたものです。

次を使用してインストールできます。ext install HTMLHintコマンド

1
user8197826

この拡張機能は（組み込みのルールを拡張することはできませんが）、HTMLの妥当性をチェックするためにHTMLHintよりもうまく機能することがわかりました。

名前：W3C検証

Id：umoxfo.vscode-w3cvalidation

説明：W3C検証サポートをVisual Studio Codeに追加します。

バージョン：2.3.0

パブリッシャー：Umoxfo VS

マーケットプレイスリンク： https://marketplace.visualstudio.com/items?itemName=umoxfo.vscode-w3cvalidation

0
ChekTek

HTMLHintであるVS Codeの拡張機能があります。
以下に従ってインストールできます。
1。拡張機能を開くには：Marketplace Press Ctrl + Shift + X
2。検索拡張ボックスにHTMLHintと入力します
3。 「マイクカウフマン」によって開発されたHTMLHintを示す検索結果のインストールボタンをクリックします。

0
Riswan