ホームページ > ウェブフロントエンド > H5 チュートリアル > vue-devtools を使用して Vue を開発する

vue-devtools を使用して Vue を開発する

巴扎黑
リリース: 2017-07-21 13:47:23
オリジナル
2527 人が閲覧しました

前書き:

Vue はデータ駆動型であるため、開発およびデバッグ中に DOM 構造を表示しても何も解析できないという問題があります。

しかし、vue-devtools プラグインを使用すると、データ構造を簡単に解析してデバッグできます。

1. Chrome 拡張機能をダウンロードします

GitHub のダウンロード アドレス:

依存関係パッケージに従って npm Taobao Mirror を使用することをお勧めします

Address:

npm Taobao Mirror をインストールするコマンド ライン:

$ npm -g cnpm をインストールします--registry=https://registry.npm.taobao.org

その後、npmの代わりにcnpmを使用して依存関係パッケージをインストールできます...

2. cnpm install

ダウンロードが完了したら、コマンドライン cmd を開き、vue-devtools フォルダーに入り、依存関係パッケージに従って npm run build

3. シェル>chrome>src>manifest.jsonを開き、jsonファイルの「persistent」:falseをtrueに変更します

4. Chromeブラウザを開き、設定を開きます。 > または [プログラム] > [開発者モード] をクリックします

2 をクリックして解凍した拡張機能をロードし、shell>chrome フォルダーを

に置きます

最後に

vue で書かれたプロジェクトを開き、デバッグ ツールを開きますf12 を押して vue プロジェクトをデバッグします。

以上がvue-devtools を使用して Vue を開発するの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート