Vue テンプレート構成と Webstorm コード形式仕様設定

1. コンパイラコードフォーマット仕様設定

通常、コードを書くとき、コードのインデントは 4 スペースですが、フロントエンドでは、グローバル投票統計によると、コードのインデントには 2 スペースを使用することが推奨されています。

まず、 webstormで設定を開きます。Mac mac使用している場合は、 command + , ショートカットを使用して、 Editor-->Code Style-->HTMLに移動し、 Tab sizeとIndentの値を 2 に変更します。同様に、 JavaScriptでも 2 に変更します。

2. Vueテンプレートの設定

htmlを使用してvueを実践する場合、毎回vueインスタンス オブジェクトを作成したくない場合は、 htmlでテンプレートを設定し、 vueタグを使用して直接コードを導入することができます。

webstormの設定を開き、 Editor-->Live Templatesに移動し、 vueを選択して、 +をクリックします。

Live Templateを選択し、 Abbrevitionにvueと入力し、 Template textに設定する必要があるテンプレート テキスト コンテンツを書き込みます。

最後に、現在のページの「!」の部分でDefineクリックします。

次にHTMLをチェックし、 okをクリックして完了します。

最終的な効果を得るには、 HTMLにvueを直接入力し、 tabを押すと、設定したテンプレート コードがすぐに表示されます。

これで、 vueテンプレートの構成とwebstormコードフォーマット仕様の設定に関するこの記事は終了です。vue vue webstorm関連コンテンツについては、123WORDPRESS.COM で以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。