cssnano / cssnano

A modular minifier, built on top of the PostCSS ecosystem.
https://cssnano.github.io/cssnano/
MIT License
4.79k stars 319 forks source link

[Bug]: Tried to optimize the CSS file of my website, got a syntax error; unknown word #1672

Open rottenwheel opened 2 months ago

rottenwheel commented 2 months ago

Describe the bug

Ran the View Source Code of rottenwheel.com (single CSS file) through nano by executing: npx postcss input.css > output.css after having followed the 'Getting started' steps listed here.

Got this in my terminal:

CssSyntaxError: /home/rotten/input.css:9:1: Unknown word

   7 |     <style>body{margin:1rem auto;max-width:40rem;font:1.2em/1.62 sans-serif;color:white;background-color:black}h1,h2,h3,p{line-height:1.2;padding:0 0.62rem}a{color:white;text-decoration:none;border-bottom:1px solid white}img{width:100%;height:auto}.footer{margin:8rem 0 0 0.5rem;font-size:0.8rem}code,pre{overflow-wrap:break-word;font-size:1.2em/1.62;overflow-x:scroll}pre{margin:1rem}footer ul{list-style-type:none;padding:0;margin:0}footer ul li{display:inline;font-size:1em;line-height:1.7em}footer ul li img{display:inline;height:1rem;width:auto;vertical-align:middle;margin-bottom:0;border-radius:0}footer ul li::after{content:" | "}footer ul :last-child::after{content:""}
   8 |     </style>
>  9 | </head>
     | ^
  10 | <body>
  11 |     <h1>rottenwheel</h1>

Expected behaviour

Expected to get an optimized version of my personal website, got the first third of the code and an error message.

Steps to reproduce

Just copy and paste my site's code into a file and try to run it through nano.

Version

Latest

Preset

(no preset)

Environment

System:
    OS: Linux 6.10 Fedora Linux 40 (Workstation Edition)
    CPU: (12) x64 AMD Ryzen 5 5600U with Radeon Graphics
    Memory: 6.08 GB / 14.93 GB
    Container: Yes
    Shell: 5.2.26 - /bin/bash

Package details

├─┬ cssnano@7.0.6
│ ├─┬ cssnano-preset-default@7.0.6
│ │ ├─┬ css-declaration-sorter@7.2.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ cssnano-utils@5.0.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-calc@10.0.2
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-colormin@7.0.2
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-convert-values@7.0.4
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-discard-comments@7.0.3
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-discard-duplicates@7.0.1
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-discard-empty@7.0.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-discard-overridden@7.0.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-merge-longhand@7.0.4
│ │ │ ├── postcss@8.4.47 deduped
│ │ │ └─┬ stylehacks@7.0.4
│ │ │   └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-merge-rules@7.0.4
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-minify-font-values@7.0.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-minify-gradients@7.0.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-minify-params@7.0.2
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-minify-selectors@7.0.4
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-normalize-charset@7.0.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-normalize-display-values@7.0.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-normalize-positions@7.0.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-normalize-repeat-style@7.0.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-normalize-string@7.0.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-normalize-timing-functions@7.0.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-normalize-unicode@7.0.2
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-normalize-url@7.0.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-normalize-whitespace@7.0.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-ordered-values@7.0.1
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-reduce-initial@7.0.2
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-reduce-transforms@7.0.0
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-svgo@7.0.1
│ │ │ └── postcss@8.4.47 deduped
│ │ ├─┬ postcss-unique-selectors@7.0.3
│ │ │ └── postcss@8.4.47 deduped
│ │ └── postcss@8.4.47 deduped
│ └── postcss@8.4.47 deduped
├─┬ postcss-cli@11.0.0
│ ├─┬ postcss-load-config@5.1.0
│ │ └── postcss@8.4.47 deduped
│ ├─┬ postcss-reporter@7.1.0
│ │ └── postcss@8.4.47 deduped
│ └── postcss@8.4.47 deduped
└── postcss@8.4.47

Additional context

No response

PartishtaP commented 1 month ago

Please assign me this issue. I would like to contribute

ludofischer commented 1 month ago

The code sample shows HTML code, cssnano does not take HTML as input, you need to pass it the CSS separately. Does that solve the issue?

rottenwheel commented 1 month ago

@ludofischer Happy to give it another go after cleansing the input code from HTML strings. Do you know of any easy way to strip CSS code from a file? Conversely, the same would be sought after for HTML texts... Thanks.