如何使用ng serve的broswerTarget选项？

Question

我希望在构建我的Angular应用程序时自动打开Chrome。但是，我不能使用-o选项，因为我的默认浏览器是Safari（我不想改变默认浏览器）。

看起来--browserTarget就是我所需要的，但当我运行类似以下命令时：

ng serve --browserTarget=Chrome

CLI会抛出一个错误：

Schema validation failed with the following errors:
    Data path ".browserTarget" should match patter ".+:.+(:.+)?"

我似乎找不到关于如何使用该选项解决此问题的任何文档或示例。

提前致谢， Wayne

- Wayne F. Kaskie

---

我也在寻找这个配置，但似乎browserTarget是为特定浏览器生成构建的。https://github.com/angular/angular-cli/blob/v6.0.0-rc.8/packages/%40angular/cli/lib/config/schema.json#L521-L906 - Amitesh

仅供参考：https://angular.io/cli/serve - undefined

Answer 1

从angular-cli的一个问题中找到了相关信息。它用于在服务时指定使用哪个构建配置。

来自这个评论

serve命令并不完全知道如何构建它，它只知道如何服务它。

通常只有一个构建，但由于目标可以有多个配置，因此您可以指定要服务的构建的特定配置。

其中“browserTarget”：“next-app：build”表示“我想使用默认选项服务项目-> next-app”，而“browserTarget”：“next-app：build:production”表示“我想使用与生产配置合并的默认选项服务项目-> next-app”。

- Eazash

Answer 2

我为了这个问题搜索了几个小时，除了你的问题外，没有找到太多答案。我是一个 Angular 新手，没有资格回答，但是这个问题已经被查看了 650 次，但迄今为止没有其他人提供答案。所以，至少当我在一年后忘记它并再次搜索解决方案时，我会找到以下比没有好的答案。

似乎 --browserTarget 标志是一个误导。我实现的解决方案是使用来自此处的 open-cli 包：open-cli --
安装如下：

> npm install --global open-cli

然后，在Angular项目的根文件夹中的package.json文件的"scripts":{...}部分，我替换了这行：

"start": "ng serve",

通过这行代码：

"start": "open-cli http://localhost:4200 -- 'chrome' && ng serve",

请注意，以上内容仅适用于 Windows 机器。在 Linux 上使用 'google-chrome'，在 Mac 上使用 'google chrome'，在 Windows 上使用 'chrome'，这取决于平台。

然后，我从命令行发出以下命令来启动服务器并打开我的（非默认）Chrome 浏览器：

> npm start

这种方法有一些缺点，希望大家可以在评论中（或另一个答案中）温和地指出并提出改进意见：

1. 我已经硬编码了端口，应该从其他地方动态获取。
2. 浏览器在页面编译完成之前就打开了，因此会出现“连接被拒绝”的错误，可能会引起困惑。耐心等待后，一旦构建完成并启动Angular服务器，浏览器会自动刷新，但需要几秒钟的时间。

- Jimbo1987

---

如果你在 open-cli 命令前面加上 ng serve &&，这实际上会在没有第二个问题的情况下起作用。我敢打赌端口也可以作为一个变量。但这不是一个坏主意。 - Wayne F. Kaskie