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

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

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

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

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

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

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

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

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

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

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

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


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

以下もご興味があるかもしれません:
  • Webstorm と Chrome を使用して Vue プロジェクトをデバッグする方法
  • WebStormはVue3統合APIのソリューションを正しく識別できません
  • Idea または Webstorm を使用して Vue プロジェクトを実行する方法 (詳細な手順)
  • Vueプロジェクトに基づいてresolves.alias: ''@''パスを設定し、Webstormに適応します
  • Webstorm で vue-cli スキャフォールドを構築する方法に関する簡単なチュートリアル
  • Idea および WebStorm の Vue cli スキャフォールディング プロジェクトで Webpack エイリアスが使用できない問題を解決します
  • webstorm+vueでプロジェクトを初期化する方法
  • vue: WebStorm で高速コンパイルと実行を設定する方法
  • WebStormにおけるVue構文サポートの詳細な説明
  • Webstorm と .vue の es6 構文エラーの解決策

<<:  mysqlにコメント情報を追加する実装

>>:  docker を使用した pxc クラスターのインストールに関する詳細なチュートリアル

推薦する

Vue CLI のモードと環境変数の詳細な説明

序文実際のプロジェクトの開発では、通常、プロジェクト開発フェーズ、テストフェーズ、最終オンラインフェ...

JavaScript におけるさまざまなバイナリオブジェクトの関係の詳細な説明

目次序文さまざまなオブジェクト間の関係配列バッファ型付き配列Uint8ClampedArray文字間...

MySQL の非主キー自己増分使用例の分析

この記事では、例を使用して、MySQL の非主キーの自己増分の使用方法を説明します。ご参考までに、詳...

MySQLデータベースに接続し、クエリ操作を実行するためのIDEAの完全なコード

1.まずMysqlリンク設定ページを書く パッケージ com.wretchant.fredis.me...

ウェブサイト標準の検証方法を通じてFlashページを共有する方法

1. 埋め込みは違法です<embed> タグは Netscape のプライベート タグで...

MySQL 5.7.16 ZIP パッケージのインストールと設定のチュートリアル

この記事では、MySQL 5.7.16 ZIPパッケージのインストールと設定のチュートリアルを参考ま...

CD コマンドを使わずに Linux でディレクトリ/フォルダに入る方法

ご存知のとおり、cd コマンドがないと、Linux でディレクトリを切り替えることはできません。それ...

MySQL エラー「すべての派生テーブルには独自のエイリアスが必要です」の解決方法

MySQL は、マルチテーブルクエリを実行するときにエラーを報告します。 [SQL] SELECT ...

VMWare 仮想マシン 15.X LAN ネットワーク構成チュートリアル図

最近、分散型およびビッグデータ技術について学ぶために、いくつかの仮想マシンに取り組んでいます。まず、...

SQLはROW_NUMBER() OVER関数を使用してシーケンス番号を生成します。

構文: ROW_NUMBER() OVER(PARTITION BY COLUMN ORDER BY...

HTML ウェブページの段落レイアウトと改行

Web ページの外観はレイアウトに大きく左右されます。ページ内に長い段落のテキストがある場合、通常は...

Docker プライベート ウェアハウスを構築する (自己署名方式)

作成したイメージを一元管理し、サービスの展開を容易にするために、プライベート Docker リポジト...

Vue3.0のさまざまなリスニング方法の包括的な概要

目次リスナー1.ウォッチエフェクト2.見る1.1 聴くための最初の方法1.2 聞く2つ目の方法1.3...

HTMLはフォームタグを使用して登録ページのサンプルコードを実装します。

ケースの説明: - ページ効果を実現するためにテーブルを使用する- ハイパーリンクを機能させたくない...

Docker で MySQL を起動したときに SQL 文を自動的に実行する方法

Docker で MySQL コンテナを作成する場合、コンテナの起動後にデータベースとテーブルが自動...