webpack - 如何在样式组件配置中禁用 vendor 前缀？

Question

我正在使用 styled-components我的 React 项目中的库。
我想在开发期间禁用供应商前缀的生成。
在这么多相似的属性中找到一个指定的 CSS 属性来切换它并在浏览器的开发工具中测试是非常麻烦的。
看看这张图片(借用一个关于相同的问题)

我在互联网上找到的任何东西都是使用 disableVendorPrefixes StyleSheetManager 上的 Prop ，这对我来说不是解决方案，因为:

我不使用 StyleSheetManager

我想把它作为我的开发 Webpack 配置文件中的配置

我发现但不能满足我的需求的东西:

https://github.com/styled-components/styled-components/issues/719

https://github.com/styled-components/styled-components/issues/285

Answer 1

我遇到了你的情况，也没有使用 StyleSheetManager。自 StyleSheetManager是他们用于应用您可能需要重新考虑的设置的机制。只需将您的顶级组件包装在该组件中。如果您只想在开发模式下禁用供应商前缀，您可以像这样有条件地设置它...

import { StyleSheetManager } from 'styled-components'

<StyleSheetManager disableVendorPrefixes={process.env.NODE_ENV === 'development'}>
    <YourApp />
</StyleSheetManager>