ng 构建消息“无法读取未定义的属性 'toLowerCase' 中的错误”

Question

我正在使用 Azure DevOps YAML 管道来构建/部署我的 Angular 9 应用程序。 YAML 包含一个 Powershell 脚本来构建它，如下所示

- powershell: |
    $angularBuildConfiguration = "MyBuildConfig";

    write-host "ng-build start";
    ng build --prod --aot --configuration $angularBuildConfiguration;
    write-host "ng-build end";

  workingDirectory: '$(Build.SourcesDirectory)\...'
  displayName: 'Build app - Angular app'

以上内容通过 Angular 构建，最后返回消息“ERROR in Cannot read property 'toLowerCase' of undefined”。

我已验证 workingDirectory 和 angularBuildConfiguration 参数具有预期的值 - 我也已将它们替换为硬编码值并获得相同的结果。如果我在构建服务器（实际运行 YAML 脚本的位置）上运行上面的 Powershell 脚本，则在预期的文件夹中构建失败并显示相同的错误消息，但是如果我在本地计算机上使用相同的脚本构建它会成功构建

我不知道这是否是一个 ng 构建问题，或者我的 Angular 9 项目中是否存在导致错误的东西 - 没有标记伴随错误消息的“关联”文件

有人有什么想法吗？

Answer 1

这真的很随机​​ - toLowerCase 消息没有引用任何 javascript/typescript 代码 - 它必须是内部消息。我可以通过消除过程查明问题出在哪里的唯一方法 - 即一次取出一批网页，直到我得到一个干净的产品编译 - 然后再包括一个一个地工作以找到罪魁祸首。

存在导致问题的样式 - 我们替换了以下样式

.gridlines-left {
  border: 1px solid #c0c0c0;
  border-right-width: 0;
  border-top-width: 0;
  border-bottom-width: 0;
}

...与

.gridlines-left {
  border: 1px solid #c0c0c0;
  border-right-style: none;
  border-top-style: none;
  border-bottom-style: none;
}

...编译成功。我仍然不知道如何/为什么，因为我们有很多非常相似的其他样式，并且使用了相同的设置border-right/left/bottom/top-width: 0 的策略——这可能与我们如何组合css有关类 - 某些样式可能会在编译时与其他样式发生冲突 - 谁知道呢，但现在一切正常，从那以后就没有问题了

Answer 2

将字符串变量转换为小写时代码库中存在错误。 简单地说，它试图将 undefined 或 false 值转换为小写。

要使用小写的 JavaScript 内置函数，变量应该是真值。

所以在代码库中搜索它，然后像下面这样更新它。

If (variable) {
    variable = variable.toString().tolowercase();
}