mirror of
https://github.com/tailwindlabs/tailwindcss.git
synced 2025-12-08 21:36:08 +00:00
ea6f14a499
* add `collapseDuplicateDeclarations`
This will allow us to remove duplicate declarations. This occurs when
you are using `@apply` for example.
The reason I implemented it as a separate step, is because this doesn't
only happen for `@apply`, but it also happens if you do something like:
```js
addComponents({ '.btn-blue, .btm-red': { padding: '10px' } })
```
So instead of tracking down every place this is happening, it now
happens at the very end.
* use new plugin in processTailwindFeatures
* add/update tests by removing duplicate declarations
* update changelog
29 lines
742 B
JavaScript
29 lines
742 B
JavaScript
export default function collapseDuplicateDeclarations() {
|
|
return (root) => {
|
|
root.walkRules((node) => {
|
|
let seen = new Map()
|
|
let droppable = new Set([])
|
|
|
|
node.walkDecls((decl) => {
|
|
// This could happen if we have nested selectors. In that case the
|
|
// parent will loop over all its declarations but also the declarations
|
|
// of nested rules. With this we ensure that we are shallowly checking
|
|
// declarations.
|
|
if (decl.parent !== node) {
|
|
return
|
|
}
|
|
|
|
if (seen.has(decl.prop)) {
|
|
droppable.add(seen.get(decl.prop))
|
|
}
|
|
|
|
seen.set(decl.prop, decl)
|
|
})
|
|
|
|
for (let decl of droppable) {
|
|
decl.remove()
|
|
}
|
|
})
|
|
}
|
|
}
|