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

Posted 2023-03-15

【中文标题】ng 构建消息“无法读取未定义的属性 \'toLowerCase\' 中的错误”

【英文标题】：ng build message "ERROR in Cannot read property 'toLowerCase' of undefined"ng 构建消息“无法读取未定义的属性 'toLowerCase' 中的错误”

【发布时间】：2020-05-07 05:33:19

【问题描述】：

我正在使用 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 项目中是否存在导致错误的东西 - 没有标记伴随错误消息的“关联”文件

有人有什么想法吗？

【问题讨论】：

我也有同样的问题。它甚至没有显示行号

我也有同样的问题。我通过删除 --prod 解决了这个问题，但这不是解决方案。

【参考方案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有关类 - 某些样式可能会在编译时与其他样式发生冲突 - 谁知道呢，但现在一切正常，从那以后就没有问题了

【参考方案2】：

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

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

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

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

【讨论】：

感谢 JuCheng - 问题并不是关于为什么代码的特定部分会导致问题 - 而是关于为什么它被“ng build”标记 - 错误消息“无法读取属性'toLowerCase' of undefined" 是一条运行时消息——我正在运行编译——“ng build”是否真的知道我的代码的哪些部分导致了这些类型的错误，或者 ng build 内部是否存在引发错误的东西? （如果它是我代码的一部分，为什么它不标记导致问题的文件？）

是的。 ng build 编译，它将通过代码库一一运行。在运行ng build 时，如果出现问题，它只会抛出错误并结束构建过程。如果那不存在特定的问题文件名，但我当然认为代码库中存在问题。我建议检查）

嗨 JuCheng - 我不相信“ng build”会产生此消息，因为正在编译的代码库不包含对未定义的检查 - 我已经完成了全局搜索和替换所有代码库中 ".toLowerCase()" 的实例并替换为 "" - 然后使用上面的 ng 构建脚本重新编译，仍然得到相同的错误消息