お気に入りの Web ブラウザでお使いの Web アプリをプレビューするには、お使いのコンピューターにローカルの Web サーバーを設定する特別な操作は必要ありません。Yeoman に含まれています。
サーバーの起動
npm スクリプトを実行して、localhost:3000 (またはいくつかの構成では 127.0.0.1:3000) で nodejs ベースのローカルの HTTP サーバーを作成するには、次のように入力します。
npm run serve
Web ブラウザで localhost:3000 に新しいタブを開きます。
サーバーの停止
サーバーを停止する必要がある場合は、Ctrl + C キーボードコマンドを使用して、現在の CLI プロセスを終了します。
注: 同じポート (既定値は 3000) で複数の HTTP サーバーを実行することはできません。
ファイルの監視
お気に入りのテキストエディターを開き、変更を開始します。保存するたびに、自動的にブラウザが更新されるので、自分で行う必要はありません。これはライブリロードと呼ばれ、アプリケーションの状態をリアルタイムで確認できる便利な方法です。
ライブリロードは、gulpfile.js で構成された一連の Gulp タスクと、gulp_tasks/browsersync.js で構成された Browsersync によってアプリケーションで利用できます。ファイルの変更を監視し、変更を検出すると自動的にリロードします。
以下では、src/app/components ディレクトリで Header.js を編集しました。ライブリロードのおかげで、以下から瞬時に次のように変化します。
これ
すぐにこれ
テストをお忘れなく!
TodoMVC アプリをテストし、タイトルヘッダーを変更しました。ライブリロードを実証するには、`mytodo/src/app/components/Header.spec.js` でテストを編集**するか**変更を元に戻す必要があります。