时间戳

首页 > 解决方案 > 有没有办法使用样式组件在构建时导出语义类名？

styled-components - 有没有办法使用样式组件在构建时导出语义类名？

问题描述

常量 ComponentName = styled.div``;

我们可以在输出 html 中获取类名，如 class="ComponentName" 而不是 class="btf79-fhjas MkrI" 类名吗？

标签： styled-components

解决方案

如果您想在 google devtools 中显示样式化的组件名称，我想为此分享一个简单的解决方案：

  1. 像这样安装 Babbel 插件：npm install --save-dev babel-plugin-styled-components
  2. 如果您使用create-react-app，您应该 import styled from "styled-components/macro";在每个组件的顶部写下您希望在其中使用样式化组件的部分。

结果，样式化组件的名称将显示为 devtools 中的元素 className

推荐阅读