ホームページ >開発ツール >VSCode >vscodeでvueテンプレートコードを設定する方法

vscodeでvueテンプレートコードを設定する方法

王林
王林オリジナル
2020-02-11 15:21:555407ブラウズ

vscodeでvueテンプレートコードを設定する方法

(1) Vetur プラグインと VueHelper プラグインをインストールします。インストールが完了したら、VScode を再起動する必要があります

vscodeでvueテンプレートコードを設定する方法

拡張プラグインの検索ボックスで次の Vetur プラグインと VueHelper プラグインを見つけて、アイコンに注目してください。

vscodeでvueテンプレートコードを設定する方法

#(2) vue のテンプレート コード スニペットを追加します。

vscodeでvueテンプレートコードを設定する方法

vue 項目を選択します

vscodeでvueテンプレートコードを設定する方法

開いた vue.json にテンプレート コード スニペットを追加します。

{
	"vue": {
	"prefix": "vue",
	"body": [
		"<template>",
		"  <div>",
		"  </div>",
		"</template>",
		"<script>",
		"</script>",
		"<style scoped>",
		"</style>",
	],
	"description": "generate a vue file"}
}

(3) vue ファイルに vue プレフィックスを入力すると、前に作成したプレフィックスが自動的に認識されます。コード スニペットの説明。Tab キーを押すか選択すると、テンプレート コード スニペットが vue ファイルに自動的に追加されます。

vscodeでvueテンプレートコードを設定する方法

関連する推奨事項:

vscode チュートリアル

以上がvscodeでvueテンプレートコードを設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。