设置 Angular CLI 生产构建 TFS

Question

本地项目可以通过ng build --prod正常构建，但是如果我使用以下powershell脚本在Team Foundation Server上设置它，它将失败并出现一些错误：

Powershell脚本：

npm install
npm run ng build --prod

tfs构建输出：

• [1m[33m警告：./~/css-loader?{"sourceMap":false,"importLoaders":1}!./~/postcss-loader!./~/sass-loader!./src/scss/style.scss

• autoprefixer: D:\a\1\s\src\scss\style.scss:7468:3: 将transition-property替换为transition，因为Autoprefixer无法支持transition-property和其他transition-*的任何情况 @ ./src/scss/style.scss 4:14-203 2017-04-30T07:17:51.9419669Z @ multi ./~/primeng/resources/themes/bootstrap/theme.css ./~/primeng/resources/primeng.min.css ./~/font-awesome/css/font-awesome.css ./src/scss/style.scss[39m[22m

• [错误] 0% 正在编译 10% 正在构建模块 0/1 模块 1 活动的多D:\a\1\s\src\main.ts

• [错误]进程完成，退出代码为0，并写入3个错误到错误流中。

- Rick

---

尝试删除本地的node_modules文件夹，然后再次运行npm I并重新构建。您是否会看到相同的错误？ - yurzui

本地构建正常，但无法在团队基础架构服务器上构建。 - Rick

我明白了，也许你的软件包版本与 TFS 不同。我曾经遇到过同样的问题。它在本地机器上运行正常，因为我使用了旧版本并没有更新本地的 node_modules。 - yurzui

@yurzui 我尝试了一下，构建成功了，但是在tfs上不行。你使用的构建主机是哪个？你的脚本和我的一样吗？ - Rick

我知道它可以在你的本地服务器上运行，你能否手动测试一下这个文件或命令在你的构建代理服务器上是否能够运行。你的项目映射到路径 D:\a\1\s\。 - Tingting0929

@Tingting0929-MSFT，非常抱歉，请问我该如何在我的构建代理上运行它？我正在使用 TFS 上的托管代理。 - Rick

Answer 1

现在它能够正常工作了，我删除了powershell脚本并在构建过程中添加了单独的任务。

• npm install（标准安装）
• npm install -g @angular/cli（命令行安装）
• ng build --prod（命令行构建）

根据评论更新:

您还可以使用：npm run ng build -- --prod。这样您就不必安装angular/cli。

- Rick

---

你是否在使用三个 PowerShell 脚本？（一个脚本一行）？ - nerlijma

@nerlijma，我目前没有使用PowerShell脚本，只是使用cmd命令。 - Rick

每次构建运行时都会安装CLI吗？ - jparram

是的，这不是最好的选择，但目前它能够工作。 - Rick

我尝试了同样的事情，但是我一直收到错误提示：'ng' 不被识别为内部或外部命令，可执行程序或批处理文件。 - Siddhant

Answer 2

在下面的配置中添加npm任务（添加任务 >> 包 >> npm）

最初的回答已翻译完毕。

- ElasticCode

---

这对我来说起作用了。我之前遇到了一个不同的错误，但是我尝试在TFS构建中使用版本0.*，它就起作用了。 - Paras Sachapara

Answer 3

我正在做与标记答案相同的事情，但是每次都全局安装angular-cli让我感到很困扰。所以我稍微修改了一下：

node $(Build.SourcesDirectory)/node_modules/@angular/cli/bin/ng build --prod -op $(Build.BinariesDirectory) -v

现在，npm安装所有依赖项后，它将安装cli，然后只需使用它即可。

- Agash Thamo.