【问题标题】：Chrome devtools reporting the same CSS on the same line twiceChrome devtools 在同一行报告相同的 CSS 两次
【发布时间】：2015-04-06 12:58:02
【问题描述】：

Chrome DevTools 在同一行报告了两次相同的 CSS。还有人看到这个吗？我该如何解决？

问题出现在 stable (40) 和 Canary (42) 中

style.css 仅加载一次。它没有被缩小。

【问题讨论】：

你能链接到你看到这个的地方吗？
愚蠢的问题，但你确定 style.css 没有被包含/加载两次吗？检查网络或来源选项卡。
@mikemaccana 你在使用预处理器还是缩小你的css？

标签： css google-chrome-devtools

【解决方案1】：

这里有几个选项：

你可能已经包含了两次样式表

如果不是这种情况（您没有使用预处理器或缩小），我怀疑您是否包含了对同一文件的两个引用。 为此使用查看源代码 - 在网络标签中，它们将显示为同一个文件。

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test</title>
    <link rel="stylesheet" href="test.css" />
    <link rel="stylesheet" href="test.css" />
</head>
<body>
    <h2 class="title">Title</h2>
</body>
</html>

CSS

h2.title {font-size: 30pt; color: #24a222; }

结果

你可能在同一行声明了两次 h2.title。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test</title>
    <style>
        h2.title {font-size: 30pt; color: #24a222; }h2.title {font-size: 30pt; color: #24a222; }
    </style>
</head>
<body>
    <h2 class="title">Title</h2>
</body>
</html>

【讨论】：

这是我的问题，我没有意识到在 React 中使用 Helmet 时重复了两次头部。