However, this URL returns a 500 because of the following error:
System.InvalidOperationException: Expected expression, found '',Expected expression, found ''
at Smidge.Nuglify.NuglifyCss.ProcessAsync(...)
...
at Smidge.FileProcessors.CssImportProcessor.ProcessAsync
In the development environment Smidge/NUglify doesn't seem to run, so we get one CSS for each package, and of all these work.
So it seems the backoffice/admin Smidge/NUglify is broken because something in the installation, or a package, makes Smidge/NUglify try to import an empty file, or something similar.
Clearing the App_Plugins folder and re-installing and re-deploying all packages does not help.
As a workaround, is there a way to turn off backoffice/admin Smidge/NUglify to get the same behavior as in development? Removing the RuntimeMinification block from AppSettings doesn't seem to make a difference.
Any other ideas what could be breaking this?
The packages that load CSS files are:
Diplo GodMode
Translation Manager
Translation Manager Languagewire Connector
Umbraco Forms
uSync
Removing each package one by one and testing is a bit tedious because it works in development. And when clearing the App_Plugins folder in production Umbraco still tries to load CSS/JS from those folders, so Smidge/NUglify breaks anyway. Not sure how Umbraco "remembers" what to load.
EDIT: SimpleRedirects is missing from the package list above, and it seems to be causing the problem (see below).
In terms of the issue you having, i would take a look on development (which is probably running in debug mode?) and see if there are any files that are not loading in the browser (e.g 404 errors in the network tab in chrome) - if there are files missing then in debug Umbraco will still attempt to load them but silently fail.
It's the minification itself that causes the 500 in production, not the cache; clearing all Smidge caches recreates the problem and the NUglify error. Is there any way to actually disable backoffice/admin minification in production?
There are no 404s or other indications in development/debug that anything is missing. Umbraco itself and all packages load fine and have all CSS applied. Specifically, all CSS files configured in all package manifests (as far as we can see) exist on disk and are loaded in development/debug.
I don't think there is a way of disabling minification short of moving the whole site into debug :(
I've just done a quick test on v9 with those packages and the CSS file does appear to still work when in production. it might be worth checking you are running the latest versions of the packages/umbraco ??
Could this be related to .NET 5 vs .NET 6? I know that we had problems with System.WebOptimizer that when upgrading to .NET 6 paths with wildcards stopped working, e.g. /assets/css/*.css. The solution is running on .NET 6.
EDIT: This works on a different Umbraco .NET 6 installation, so likely not.
No. Did you? We've upgraded to 9.5.2 but the problem remains.
Since it seems to work in a minimal reproduction our only plan at the moment is to recreate the web project and migrate all the code/settings. And we would probably do this when upgrading to Umbraco 10.
If NuglifyCss could report which manifest or css file causes the error it would help. :)
System.InvalidOperationException: Expected expression, found
'',Expected expression, found '' at
Smidge.Nuglify.NuglifyCss.ProcessAsync(FileProcessContext
fileProcessContext, PreProcessorDelegate next)
Fresh deploy after upgrade. Still no idea which manifest or CSS causes the error. Haven't found any manifest files with empty/missing CSS references.
EDIT: Turns out SimpleRedirects is causing the problem. If I replace the two CSS files in SimpleRedirects with empty/minimal/working CSS files, the backoffice CSS starts working. Unfortunately I missed that package when describing the problem, so it wasn't part of the minimal reproduction. So perhaps this is an actual incompatibility in the package in question.
I think I have found out what is causing this, at least in my case.
There is an error logged which can be found in the log viewer:
System.InvalidOperationException: Expected hex color, found '#ffff'
at Smidge.Nuglify.NuglifyCss.ProcessAsync(FileProcessContext fileProcessContext, PreProcessorDelegate next)
at Smidge.FileProcessors.PreProcessPipeline.ProcessNext(Queue`1 queue, FileProcessContext fileProcessContext)
at Smidge.FileProcessors.PreProcessPipeline.<>cDisplayClass5_0.<0>d.MoveNext()
So when I search the solution for this I found it in a custom plugin css file.
So my suggestions would be to check the log and see if there are any css issues.
Thank you. In my case it was a plugin/package called SimpleRedirects, but this plugin/package is supposedly confirmed to work on 9/10 so there must be some special circumstance.
Disabling the offending plugin's CSS manually is our current workaround.
Either way, it's annoying that all plugin CSS stops working because of one offending CSS. Is there a way to tell Smidge to skip (or use as-is) plugin CSS/JS files that can't be processed?
System.InvalidOperationException: Expected identifier, found ' ',Expected selector, found '-',Expected comma or open brace, found '-',Expected identifier, found ' ',Expected selector, found '-',Expected comma or open brace, found '-'
at Smidge.Nuglify.NuglifyCss.ProcessAsync(FileProcessContext fileProcessContext, PreProcessorDelegate next)
at Smidge.FileProcessors.PreProcessPipeline.ProcessNext(Queue`1 queue, FileProcessContext fileProcessContext)
at Smidge.FileProcessors.PreProcessPipeline.<>c__DisplayClass5_0.<<ProcessNext>b__0>d.MoveNext()
--- End of stack trace from previous location ---
at Smidge.FileProcessors.PreProcessPipeline.ProcessNext(Queue`1 queue, FileProcessContext fileProcessContext)
at Smidge.FileProcessors.PreProcessPipeline.<>c__DisplayClass5_0.<<ProcessNext>b__0>d.MoveNext()
--- End of stack trace from previous location ---
I am still trying to solve this one for my own site...
I agree that it would be ideal if:
Smidge would include the problematic filename in the Error message.
Umbraco had a way to disable Smidging the back-office assets.
Have you updated Smidge also? I updated Nuglify many versions in the v4.1.1 release to fix various issues simular to this, I should send Umbraco a PR to update the dependency version also.
Smidge doesn't show up in "Manage NuGet Packages" (neither Solution nor Project) so I would never have thought to update it.
I didn't even know Smidge was a package dependency.
And I'm not even sure how I would go about updating Smidge in my Umbraco solution or project. Would I need to install Smidge manually in the web project? Maybe a general dotnet question, but still. :)
Even with the update to 4.1.1, what would have changed in my case? The issue was completely un-NUglify-able css in a plugin/addon, not a bug in NUglify.
But basically none of the backoffice is working on live plesk hosted server.
I have 3 websites now with (one is just umbaco on additional plugins and all have the same issue. 1 of these sites is a blank umbraco sites to insure that it wasnt my plugins or the others I have. It still happens on the plank site.
If this patch is going to solve my issue then I see this as a critical release that I required 6 weeks ago.
If its not going to solve my issue and you have some solutions then please help me out.
Hi Daniel,
I'm afraid I don't know if this will solve your issue unfortunately...
The update is going to be available in v10..3.0. I'm not sure exactly when, but I think the first beta for 10.3.0 should be out in about a week or so.
You can install the latest Smidge directly into your project to find out if the Nuglify update fixes your issues even before the Umbraco dependency is updated.
One of the files failed validation with issues on these lines:
...
text-indent: -120px;
margin-left: -7em;
...
(A Safari-only CSS hack)
After I removed that from the file, I was no longer getting the 500 error.
As @Per Bolmstedt suggests, if you find a failed CSS validation problem in a package maintained by someone else, raising an issue or submitting a PR will make the experience better for everyone. (Luckily in my case, the package is one I created, so an easy fix.)
@media not all and (min-resolution:.001dpcm) {
@supports (-webkit-appearance:none) {
text-indent: -120px;
margin-left: -7em;
#importfilepicker::file-selector-button {
display: inline;
}
}
}
But the Validator specifically flagged those two lines I mentioned.
Looking at this snippet, it seems to be missing a closing brace before the #importfilepicker line, and a proper selector for the text-indent, etc rules, though... which might be the REAL issue.
I admit I copied this from somewhere, and don't have a mac/iphone, so I don't have an easy time testing Safari-only issues.
Backoffice/admin CSS Smidge/NUglify error, breaking package styling
When Umbraco admin/backoffice loads, it loads this CSS:
/sb/umbraco-backoffice-css.css.v637823303400000000
However, this URL returns a 500 because of the following error:
In the development environment Smidge/NUglify doesn't seem to run, so we get one CSS for each package, and of all these work.
So it seems the backoffice/admin Smidge/NUglify is broken because something in the installation, or a package, makes Smidge/NUglify try to import an empty file, or something similar.
Clearing the
App_Plugins
folder and re-installing and re-deploying all packages does not help.As a workaround, is there a way to turn off backoffice/admin Smidge/NUglify to get the same behavior as in development? Removing the
RuntimeMinification
block from AppSettings doesn't seem to make a difference.Any other ideas what could be breaking this?
The packages that load CSS files are:
Removing each package one by one and testing is a bit tedious because it works in development. And when clearing the App_Plugins folder in production Umbraco still tries to load CSS/JS from those folders, so Smidge/NUglify breaks anyway. Not sure how Umbraco "remembers" what to load.
EDIT: SimpleRedirects is missing from the package list above, and it seems to be causing the problem (see below).
Hi,
when in production there is a 'version' number setting (which isn't there by default) that can be used to break the cache for minification.
i think by default its related to the umbraco version - but you can se the value to any number and it will regenerate the cached files .
from the docs :
In terms of the issue you having, i would take a look on development (which is probably running in debug mode?) and see if there are any files that are not loading in the browser (e.g 404 errors in the network tab in chrome) - if there are files missing then in debug Umbraco will still attempt to load them but silently fail.
Thank you.
It's the minification itself that causes the 500 in production, not the cache; clearing all Smidge caches recreates the problem and the NUglify error. Is there any way to actually disable backoffice/admin minification in production?
There are no 404s or other indications in development/debug that anything is missing. Umbraco itself and all packages load fine and have all CSS applied. Specifically, all CSS files configured in all package manifests (as far as we can see) exist on disk and are loaded in development/debug.
Hi Per,
I don't think there is a way of disabling minification short of moving the whole site into debug :(
I've just done a quick test on v9 with those packages and the CSS file does appear to still work when in production. it might be worth checking you are running the latest versions of the packages/umbraco ??
from my quick test :
Thank you.
Could this be related to .NET 5 vs .NET 6? I know that we had problems with
System.WebOptimizer
that when upgrading to .NET 6 paths with wildcards stopped working, e.g./assets/css/*.css
. The solution is running on .NET 6.EDIT: This works on a different Umbraco .NET 6 installation, so likely not.
Hi Per,
Did you find a solution for this? I'm having the exact same problem.
No. Did you? We've upgraded to 9.5.2 but the problem remains.
Since it seems to work in a minimal reproduction our only plan at the moment is to recreate the web project and migrate all the code/settings. And we would probably do this when upgrading to Umbraco 10.
If NuglifyCss could report which manifest or css file causes the error it would help. :)
Problem remains after upgrading to 10.1:
Fresh deploy after upgrade. Still no idea which manifest or CSS causes the error. Haven't found any manifest files with empty/missing CSS references.
EDIT: Turns out SimpleRedirects is causing the problem. If I replace the two CSS files in SimpleRedirects with empty/minimal/working CSS files, the backoffice CSS starts working. Unfortunately I missed that package when describing the problem, so it wasn't part of the minimal reproduction. So perhaps this is an actual incompatibility in the package in question.
I think I have found out what is causing this, at least in my case.
There is an error logged which can be found in the log viewer:
at Smidge.Nuglify.NuglifyCss.ProcessAsync(FileProcessContext fileProcessContext, PreProcessorDelegate next) at Smidge.FileProcessors.PreProcessPipeline.ProcessNext(Queue`1 queue, FileProcessContext fileProcessContext) at Smidge.FileProcessors.PreProcessPipeline.<>cDisplayClass5_0.<0>d.MoveNext()
So when I search the solution for this I found it in a custom plugin css file. So my suggestions would be to check the log and see if there are any css issues.
Thank you. In my case it was a plugin/package called SimpleRedirects, but this plugin/package is supposedly confirmed to work on 9/10 so there must be some special circumstance.
Disabling the offending plugin's CSS manually is our current workaround.
Either way, it's annoying that all plugin CSS stops working because of one offending CSS. Is there a way to tell Smidge to skip (or use as-is) plugin CSS/JS files that can't be processed?
I came across this issue today on a v10.2.1 site.
My specific error logged is:
I am still trying to solve this one for my own site...
I agree that it would be ideal if:
What I found which might help this issue in general (based on following clues here: https://github.com/umbraco/Umbraco-CMS/issues/11374) was checking the package.manifest files for all App_Plugins.
Specifically, look at the "css" and/or "js" portions of the json. These things might cause issues:
Empty array - ex:
"css": [ ]
(remove empty array properties)Inaccurate path - Make sure the paths start like
"~/App_Plugins/..."
(note the starting tilda (~) and correct capitalization.)Single quote marks instead of double-quote marks ex:
'~/App_Plugins...'
(change to double-quotes)That's a nice summary.
We have to remember to create issues when we find non-working plug-ins. I did this with the one that started this topic and it was swiftly fixed.
Instead of just fixing any of the three issue-causers in your post (or other issue-causers) locally as I was very tempted to do.
Have you updated Smidge also? I updated Nuglify many versions in the v4.1.1 release to fix various issues simular to this, I should send Umbraco a PR to update the dependency version also.
Update: have submitted a PR - https://github.com/umbraco/Umbraco-CMS/pull/13071
Smidge doesn't show up in "Manage NuGet Packages" (neither Solution nor Project) so I would never have thought to update it.
I didn't even know Smidge was a package dependency.
And I'm not even sure how I would go about updating Smidge in my Umbraco solution or project. Would I need to install Smidge manually in the web project? Maybe a general dotnet question, but still. :)
EDIT: This is answered below
Smidge is currently only listed as a dependency for
Even with the update to 4.1.1, what would have changed in my case? The issue was completely un-NUglify-able css in a plugin/addon, not a bug in NUglify.
Update: has been merged and will be available in v10.3.0 😉
When is this update going to be available.
I have an issue that I cant prove if this will solve but I hope it will.
I have seen a few people with the same issue but non seem to be getting any solutions.
Refer to https://our.umbraco.com/forum/using-umbraco-and-getting-started/109430-umbraco9-live-backoffice-on-showing-any-content for details.
But basically none of the backoffice is working on live plesk hosted server.
I have 3 websites now with (one is just umbaco on additional plugins and all have the same issue. 1 of these sites is a blank umbraco sites to insure that it wasnt my plugins or the others I have. It still happens on the plank site.
If this patch is going to solve my issue then I see this as a critical release that I required 6 weeks ago.
If its not going to solve my issue and you have some solutions then please help me out.
Just to confirm; this has nothing to do with "Backoffice/admin CSS Smidge/NUglify error, breaking package styling", right?
Hi Daniel, I'm afraid I don't know if this will solve your issue unfortunately... The update is going to be available in v10..3.0. I'm not sure exactly when, but I think the first beta for 10.3.0 should be out in about a week or so.
According to release page: https://our.umbraco.com/download/releases/1030
No date set yet.
There's a 10.3 release candidate now, if you want to test.
But I still think this is unrelated to this thread. :)
You can install the latest Smidge directly into your project to find out if the Nuglify update fixes your issues even before the Umbraco dependency is updated.
Updating the Smidge packages didn't resolve my back-office error.
I ended up troubleshooting the CSS files for all App_Plugins using this tool:
https://jigsaw.w3.org/css-validator/
One of the files failed validation with issues on these lines:
(A Safari-only CSS hack)
After I removed that from the file, I was no longer getting the 500 error.
As @Per Bolmstedt suggests, if you find a failed CSS validation problem in a package maintained by someone else, raising an issue or submitting a PR will make the experience better for everyone. (Luckily in my case, the package is one I created, so an easy fix.)
That's valid css when I run it through jigsaw. Can you show the error?
And it's very strange that it would give these Nuglify errors you posted earlier:
Are you sure there wasn't something else broken in the css around those lines?
The whole chunk I removed was this:
But the Validator specifically flagged those two lines I mentioned.
Looking at this snippet, it seems to be missing a closing brace before the
#importfilepicker
line, and a proper selector for thetext-indent
, etc rules, though... which might be the REAL issue.I admit I copied this from somewhere, and don't have a mac/iphone, so I don't have an easy time testing Safari-only issues.
is working on a reply...