Weird spacing

[soranoo]

          hmm what was that weird spacing

Originally posted by @hoangnhan2ka3 in https://github.com/soranoo/next-css-obfuscator/issues/9#issuecomment-1925548768

[hoangnhan2ka3]

I discovered that when I break a line like this, it will cause the above spacing error:

When I put className on the same line as usual, everything is fine:

But if you actually put it in one line, it would be really long 🥲

[hoangnhan2ka3]

Oh here we go again https://github.com/soranoo/next-css-obfuscator/issues/4 🫡

[hoangnhan2ka3]

I don't know, but...

I just tried using cssnano in postcss.config.js and the problem seems to be resolved

Multi-line className:

Result ✅:

Although in production cssnano reports some Parse error or UNKNOWN_DIMENSION errors if you use viewport unit in a calc with other units (?)

eg: calc(100% - 0.94dvw)...

But in general, these errors are harmless, so this can be considered an effective temporary method.

[hoangnhan2ka3]

Or do you have any updates on this issue in v2.1.4 @soranoo ? I hope I don't misunderstand

[soranoo]

2.1.4 is just the official release of 2.1.4-beta.1. Nothing related to this issue.

[hoangnhan2ka3]

Sorry, I have a problem unrelated to this issue, which is caching.

You know, every time you run build the obfuscate process will start from the beginning, meaning the random obfuscated classes will be completely different from the previous time. This causes nextjs cache related issue.

If a user has visited my page before, then after I update (new deployed), and they reload the page without clearing the cache, it will look like this:

And no matter how many times they try to 'refresh' the website, it will still look the same.

Unless they press Ctrl + Shift + R (aka hard reload), the site is updated.

Even when I try view page source without hard reload, the css file doesn't have any new obfuscated class, which causes an error like my website doesn't have css at all.

Do you have the same problem in your version of Next Js, or do you have any advice for me, I've been searching for it all night.

[hoangnhan2ka3]

The problem probably only occurs when I enable next-css-obfuscator.

If you don't enable it from the beginning, the TW classes will just update the new values ​​after each deployment, and the old classes don't need to be changed, and it will be cached, I think.

[soranoo]

Please open a new issue for ANY ISSUE NOT related to the current one.

[hoangnhan2ka3]

Yes, I just wanted to ask your opinion if this is considered an issue with this plugin 🫡.

[soranoo]

Since the issue was not caused by this package, I decided to leave it alone.