lightwindcss icon indicating copy to clipboard operation
lightwindcss copied to clipboard

[Bug] `ruleContextMap` may have duplicate values

Open Mizumaki opened this issue 4 years ago • 0 comments

When I analyzed this simple component,

import { css } from 'lightwindcss';

export const Card: React.VFC = () => {
  return (
    <div
      className={css`
        border: 1px solid;
        border-radius: 123px;
        color: red;
      `} />
  );
};

this CSS file was generated.

.a {
  border: 1px solid;
  border-radius: 123px;
  color: red;
}
.a {
  border: 1px solid;
  border-radius: 123px;
  color: red;
}
.a {
  border: 1px solid;
  border-radius: 123px;
  color: red;
}

I notice that this is because ruleContextMap has duplicate values.

lightwindcss.json

{
  "ruleContextMap": { "": ["a", "a", "a"] },
  "classnameMap": {
    "a": { "": "border:1px solid;border-radius:123px;color:red;" }
  },
  "declarationMap": {
    "::::border::::1px solid": "a",
    "::::border-radius::::123px": "a",
    "::::color::::red": "a"
  }
}

This can be fixed by checking the value uniqueness before pushing, but I haven't understood the whole code of this analyze function, so maybe there is a better option. So, I only created this issue.

if (a.includes(assignedClassname)) {
  continue;
}

https://github.com/uhyo/lightwindcss/blob/1440e91b86a5fe31a784e5adbbfa3ee0fd2bc97d/src/cli/analyze/generate.ts#L52

Reproduction environment

"lightwindcss": "0.1.0"

Mizumaki avatar May 16 '21 11:05 Mizumaki