Vue CLI の使用を開始する
Vue CLI により、プロジェクトのスキャフォールディング、開発サーバー、迅速なプロトタイプ作成など、開発用の一連のツールが提供されます。 これを使用すると、スターター アプリケーションをすばやく作成できるため、ライブラリやその他の設定の構成ではなく、コーディングに集中できます。
ブートストラップ
Vue CLI の主な用途は、アプリケーションをブートストラップすることです。 create スクリプトには、次のような最も一般的な構成から選択できるウィザードが用意されています。
- リンティング オプション: すべてのコードが一貫していることを確認します。 これらのオプションは、エラーの発見にも役立ちます。
- アプリケーションの種類: プログレッシブ Web アプリのサポートを追加するかどうかを選択します。
- Babel サポート: Babel の処理は、アプリを古いブラウザーで使用する必要がある場合に、新しい JavaScript 構文を古い形式の JavaScript に変換することです。
- 言語: JavaScript または TypeScript を選択します。 どちらのオプションでも問題ありませんが、TypeScript では他の機能の中でも特に型が提供されるため、アプリケーションの発展に応じて適切なオプションになる可能性があります。 Vue 自体は TypeScript に組み込まれています。
ビルド プロセス
Vue CLI は、単一ファイルの Vue コンポーネント (.vue ファイル) で動作するように設計されています。 ブラウザーがファイルを読み取ることができるように、"モジュール バンドラー" または "バンドラー" によって、.vue ファイル内の特殊な構文を適切な JavaScript、HTML、CSS に変換するプロセスが管理されます。
Vue CLI では、既定のバンドラーとして webpack が使用されます。 webpack の既定の構成は、ほとんどのシナリオで機能します。 Vue CLI を使用すると、バンドラーの構成に必要な手順を省略し、代わりに用意された設定を使用できます。
開発サーバー
どの種類のアプリケーションを開発するにも、試行錯誤が必要です。 いくつかの変更を行い、ブラウザーでページを読み込んでテストし、さらにいくつかの変更を加えます。 そして、すべてが期待どおりに動作するようになるまで、このプロセスを繰り返します。
このプロセスに必要な手順の数を最小限に抑える必要があります。 開発を効率化するために、Vue CLI には開発サーバーが含まれています。 ファイルを保存するたびに、開発サーバーではファイルの変更が検出され、プロジェクトがリビルド (または再バンドル) されます。これにより、ブラウザーでのページのテストが可能になります。