使用PostCSS自动重设CSS重置

我正在尝试postCSS项目使用create-react-app starter回购与postCSS和导入每个组件的.css文件。也就是说，每个组件都包含一个import 'styles/componentA.css';或几个。使用PostCSS自动重设CSS重置

为了在浏览器中创建一致的样式，我想导入CSS重置。我试了几件事情：

导入.css文件包含基于Eric Meyer的重置一个标准的CSS重置。
使用autoreset插件进行postCSS。

对于第一种选择，在dev模式的CSS imports添加为<style>标签到文档中。 CSS重置出现在<style>标记列表中的最后一个，尽管它被导入到顶层组件中。理想情况下，CSS Reset将首先导入。最后意味着它会覆盖我适用于基本元素的任何样式（如h1 {font-size: 40px;}）

对于第二个选项（使用autoreset），它没有出现有办法将特定规则应用于特定元素的方法。例如，我想仅将list-style: none应用于ul和ol元素。

是否可以使用autoreset插件在postCSS中执行类似Eric Meyer的CSS重置？还是我的方向完全错误，误解了它的目的？

来源

2017-04-26 Brett DeWoody

我不使用反应，但当我使用组件并重置PostCSS（我在这里构建东西时：http://ecss.io/chapter7.html）时，我遇到了类似的问题。我不想为每个组件重新加载重置，只是传统上使用的全局重置组件。

因此，我只为'globalCSS'提供了一个“组件”。这是第一个在重置中加载并加载的组件（以及全局PostCSS变量和混合），以便后续组件可以在不重新声明的情况下访问它们。

这是一种您可以使用/适应的方法吗？

来源

2017-04-27 11:07:19

当我深入了解它时，我已经想到了CSS重置对组件没有必要。组件应该能够独立运行，而不受外部组件影响（或尽可能少）。采用这种方法时，复位应该在组件基础上完成，并且组件的所有样式都应该定位到特定组件。 –

使用PostCSS自动重设CSS重置

回答

相关问题