Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[bug]lighting css will shuffle css properties order #805

Open
sbyps opened this issue Sep 1, 2024 · 2 comments
Open

[bug]lighting css will shuffle css properties order #805

sbyps opened this issue Sep 1, 2024 · 2 comments

Comments

@sbyps
Copy link

sbyps commented Sep 1, 2024

img_v3_02e8_5f9d4970-3d6e-4ccf-8b7f-f25f0f7f5b0g
img_v3_02e8_44f16586-43a8-4f71-8975-a1dc5f0c19bg

@matthiask
Copy link

The same thing happened to us as well. height:auto was ordered after height:calc(...) after minimization instead of before. (height:auto shouldn't have been there in the first place, but the change was definitely unexpected.)

@matthiask
Copy link

Here's a minimal example showing the breakage:

import fs from "node:fs";
import { transform } from 'lightningcss';

let style = `
.navigation {
    height: auto;
    height: calc(100vh - var(--header-height, 0rem));
}
`

let { code, map } = transform({
  filename: 'style.css',
  code: Buffer.from(style),
  minify: true,
  sourceMap: true
});

fs.writeFileSync(1, code);
console.log()

See:

$ node minify.mjs 
.navigation{height:calc(100vh - var(--header-height,0rem));height:auto}
$

The height:auto now overrides the calc() value instead of being overridden by it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants