Visual Studio 2015 中的 Angular 2 cli 集成

Question

我正在尝试使用 angular2 cli 设置在 Visual Studio 2015 中创建 Angular 2 应用程序。

我已完成以下步骤来设置项目

1. 执行以下安装cli的命令

   npm i -g angular-cli

2. 执行以下创建文件和文件夹结构的命令

   ng new projectname

3. 执行以下命令构建项目

   ng serve

默认情况下，angular 2 应用程序在端口 4200 上提供服务。因此，当我执行 http://localhost:4200 时，我可以看到 index.html 页面在浏览器上提供服务。我知道它是通过 ng 服务器而不是 IIS 提供的。如果我错了，请纠正我。如果我复制文件夹和文件结构并包含在我的 Visual Studio 解决方案中并运行它，我看到 Visual Studio 使用它自己的端口。即使我在项目属性中将端口设置为 4200 并尝试执行 http://localhost:4200 ，它也不起作用。我相信这是因为它现在由 IIS 托管，而 IIS 对此应用程序一无所知。有人可以告诉我如何在实时场景中进行设置

我基本上是在尝试更改 html 并使用 Visual Studio 2015 编辑器执行代码。我没有反映任何变化

Answer 1

查看您的文件结构会很有帮助。听起来您只是将 Visual Studio 用作 IDE。如果这是正确的，我不会担心使用绿色播放按钮。您必须运行任务才能构建，因此 Task Runner 将成为您的朋友。那或者只是打开控制台并从那里执行命令。

我个人更喜欢只使用 IDE，比如 Visual Studio Code，但如果你必须使用 VS，那么我推荐下面的链接。

Here is a good reference for running an Angular 2 project in Visual Studio without putting it in an ASP.NET project

Answer 2

这是How To Use Angular CLI With Visual Studio 2017 的更详细示例，它也适用于 Visual Studio 2015。

它详细介绍了如何设置项目的预构建构建事件以运行 ng build。此外，它还展示了如何使用 packages.json 文件将 CLI 输出复制到 ASP.NET Web 应用程序中。