fix: Explain file removal errors and give recommendations (#400) (#416)

Related-to vaadin/flow#9948

Cherry-picked from 'latest'.

Co-authored-by: Marko Grönroos <magi@iki.fi>

articles/flow/styling/custom-theme.asciidoc

@@ -59,7 +59,21 @@ public class LumoApplication extends Div {
 Changes to the theme folder's contents are automatically picked up during development.
 If the application has live reload enabled, the UI should reload automatically.
 Otherwise a page reload may be needed to see the changes.
-Sometimes, compilation throws an error (“no such file or directory”) when files or folders are removed from the theme folder while the application is running, but a page reload should resolve it.
+
+Sometimes, compilation throws an error (“no such file or directory”) when files or folders are removed from the theme folder while the application is running.
+This might happen due to the following reasons:
+
+. The file being removed is a style sheet referenced from [filename]#my-theme/styles.css#, or from other style sheet in the theme folder.
+In that case, to avoid re-compilation errors, remove the style sheet import first, and then remove the file.
+. The file being removed is a component style sheet in the [filename]#my-theme/components# folder, or the whole [filename]#my-theme/components# folder.
+The files inside the components folder are referenced from an autogenerated file, such as [filename]#my-theme.generated.js#, and re-compilation fails because webpack cannot find them.
+To avoid errors, remove your component style sheet simultaneously (in one go) with the theme-generated file.
+
+.Dismissing the error message
+[NOTE]
+When you encounter a “no such file or directory” error reported by webpack, shown in an overlay in your application, click on the overlay (or refresh the browser page), and it should disappear.
+You can then continue working on your application and theming.
+If it doesn't help, you need to restart the application.
 
 == Master Style Sheet