web-dev-qa-db-ja.com

Angular Visual Studio2015での2CLI統合

私はangular2cliセットアップを使用してVisualStudio2015でangular 2アプリケーションを作成しようとしています。

プロジェクトをセットアップするために次の手順を実行しました

  1. Cliをインストールする次のコマンドを実行します

    npm i -g angular-cli

  2. ファイルとフォルダの構造を作成する次のコマンドを実行します

    ng new projectname

  3. プロジェクトをビルドする次のコマンドを実行します

    ng serve

デフォルトでは、angular 2アプリはポート4200で提供されます。したがって、 http：// localhost：42 を実行すると、index.htmlページが次のようになります。ブラウザで提供されます。IISではなくngサーバー経由で提供されることを理解しています。間違っている場合は修正してください。フォルダとファイル構造をコピーしてビジュアルスタジオソリューションに含めて実行すると、そのビジュアルスタジオが表示されます。独自のポートを使用します。プロジェクトのプロパティでポートを4200に設定して実行しようとしても、 http：// localhost：42 は機能しません。現在、ホストされているためだと思います。 by IIS and IISには、このアプリケーションの手がかりがありません。リアルタイムのシナリオでセットアップする方法を誰かに教えてもらえますか？

私は基本的にHTMLに変更を加え、Visual Studio2015エディターを使用してコードを実行しようとしています。変更は反映されません

angularvisual-studio-2015angular2-cli
9
Tom

ファイル構造のビューが役立ちます。 VisualStudioをIDEとして使用しているようです。それが正しければ、緑色の再生ボタンを使用する必要はありません。タスクをビルドするにはタスクを実行する必要があるため、タスクランナーが友達になります。それか、コンソールを開いて、そこからコマンドを実行しますか。

個人的には、Visual Studio CodeのようにIDEを使用することを好みますが、VSを使用する必要がある場合は、以下のリンクをお勧めします。

ASP.NETプロジェクトに配置せずにVisualStudioでAngular 2プロジェクトを実行するための適切なリファレンス

3
Pezetter

使用方法Angular CLI With Visual Studio 2017 ）のより詳細な例を次に示します。これはVisual Studio2015でも機能します。

プロジェクトのビルド前ビルドイベントを設定してngビルドを実行する方法について詳しく説明します。また、packages.jsonファイルを使用してCLI出力をASP.NETWebアプリケーションにコピーする方法も示しています。

3
Que