reactjs - 在 create-react-app 中安装 babel-plugin-styled-components

Question

我正在尝试将 styled-components-babel-plugin 与 create-react-app 应用程序一起使用，以在我的 chrome 开发工具中将组件名称作为类名。但不知何故，我没有改变类名。我按照网站上的描述安装了 Babel 和插件，并创建了我的 .babelrc，如下所示:

{
  "presets": ["env"],
  "plugins": ["babel-plugin-styled-components"]
}

我尝试了很多预设(包括react-app)和其他babel配置的组合，也尝试在package.json中执行此操作，但我无法让它工作。问题是，我从未使用过 babel，几乎不知道为什么我需要它。所以我不知道我是否在 babel 或样式组件方面犯了错误。有人有一个带有工作样式组件 babel 插件的示例项目吗？

Answer 1

有一种更简单的方法可以实现此目的，并且不需要弹出或安装任何其他软件包:

不要像这样导入样式组件:

import styled from 'styled-components';

像这样导入:

import styled from 'styled-components/macro';

如果这对您不起作用，您可能需要更新样式组件或使用react。更多信息可以在 styled-components documentation 中找到。 .