javascript - 检查浏览器时，我在哪里可以找到我在 React 组件中编写的 CSSinJS 样式？

Question

我创建了一个 react 样式组件，它被融合到 brwoser 中，如下所示

<a href="#" role="tab" aria-selected="true" class="css-ed5ehc">
  <div class="css-1nrs7xj">
     Implementation
  </div>
</a>

我在哪里可以看到检查 DOM 树中“css-ed5ehc”和css-1nrs7xj类的实际 css 样式？

我可以在检查时在样式选项卡中看到样式，但不确定它来自哪里。它只显示在开发人员工具中

提前致谢

score 0 · Accepted Answer

Chrome 网络工具通常会在样式选项卡中显示源自 CSS 规则的文件名。

与此答案类似，您也可以单击“样式”选项卡中的文件名。如果您在生产中查看某些内容，您可能需要美化 CSS，如果您说，在本地开发中使用 webpack 等，您可能需要启用源映射。

（也有可能代替文件名，inline在这种情况下它会显示“”。这应该将您重定向到可能是scoped此特定 CSS-in-JS 的 HTML 元素。）

1 回答 1