npm 运行构建错误 - 无法读取未定义的属性“toLowerCase”答案

【问题标题】：npm run build error - Cannot read property 'toLowerCase' of undefinednpm 运行构建错误 - 无法读取未定义的属性“toLowerCase”
【发布时间】：2021-07-13 13:11:22
【问题描述】：

当我尝试构建我的 react 应用程序时，出现以下错误：

Cannot read property 'toLowerCase' of undefined
CompileError: Begins at CSS selector .btn-white

我查看了论坛对问题的回答并尝试删除所有名称为btn-white的css类，但没有成功，即使在运行npm clear之后，仍然是同样的错误。我有多个 CSS 文件，在模块和我的应用程序中，我无法一个一个地删除每个文件。

这里是所有使用 btn-white 的 css 元素（不包括 node_modules 中的元素）：

// buttons
    .btn {
      span {
        color: $white;
      }
      &.btn-white {
        span {
          color: $black;
        }
      }
      &.btn-icon {
        i {
          color: $white;
        }
      }
      &.btn-dark,
      &.btn-outline-dark,
      &.btn-flat-dark {
        color: $gray-600;
      }
      &.btn-dark {
        background-color: $gray-700 !important;
      }
      &.btn-outline-dark {
        border-color: $gray-700;
        color: $gray-600;
      }
      &.btn-flat-dark {
        &:active,
        &:focus {
          background: $gray-700;
        }
      }
      &.btn-white {
        color: $body-color;
      }
    }

// other file
  &.btn-white {
    color: $body-color;
    &:hover,
    &:focus,
    &:active {
      color: $body-color !important;
    }
  }

// for white button (other file)
.btn.btn-white ~ .dropdown-menu {
  .dropdown-item:not(.acitve):hover {
    color: $body-color !important;
  }
  .dropdown-item.active {
    color: $body-color;
  }
}

如何解决这个问题？感谢您的帮助。

【问题讨论】：

你能显示更多代码吗？
@Mocuishle 已更新。
你在哪里使用过toLowerCase()函数？可以在你的仓库中搜索吗？您正在尝试对未定义的变量执行 toLowerCase
与这个错误无关，这里引用了同样的问题：“我的保证金值有一个错字，这个简单的错误是什么阻止了这个错误并给了我一个 toLowerCase 问题！”没有办法更准确地定位错误？（比如一条线什么的）

标签： reactjs npm

【解决方案1】：

我设法找到了问题所在。我不得不回到进口，花了我3个多小时。问题来自班级：.btn-#{$color_name}.btn-#{$color_type}（很难找到）并删除所有!important。我希望你永远不会遇到同样的问题:)

【讨论】：

顺便问一下，你有没有解释一下为什么删除!important 可以让它工作？
可能是因为在变量为undefined 的地方使用了!important，因此构建失败。

【解决方案2】：

也许在你所有的 CSS 文件中寻找“btn-white”，似乎很多人如果得到了某种错误的 CSS，就会出现这个错误。 Same Error

或者，如果名称“btn-white”准确，您可以添加您的 CSS 文件吗？

【讨论】：

您可以尝试删除所有“！important”吗？也许颜色变量设置不正确？