I encountered a unique issue with webpack and aurelia that I can't seem to figure out. After creating a new webpack configuration based on online resources and official documentation, the compilation goes smoothly without any errors. However, during runtime, I am faced with the following error:
css-resource.js?ada4:17 Uncaught (in promise) Error: Failed loading required CSS file: aurelia-notify/style.css
at fixupCSSUrls (css-resource.js?ada4:17)
at eval (css-resource.js?ada4:56)
at <anonymous>
Initially, I suspected it could be related to a comment stating:
// CSS required in templates cannot be extracted safely
// because Aurelia would try to require it again in runtime
You can find this comment here: https://github.com/aurelia/skeleton-navigation/blob/master/skeleton-typescript-webpack/webpack.config.js#L70, but it doesn't appear to be the root cause.
Upon further investigation with a working example, I made an interesting discovery. Everything functions as expected until I attempt to load one of the CSS files from the dependencies listed below:
<require from="aurelia-bootstrap-datetimepicker/src/bootstrap-datetimepicker-bs4.css"></require>
<require from="eonasdan-bootstrap-datetimepicker/build/css/bootstrap-datetimepicker.min.css"></require>
(Please note that the dependencies mentioned and the error message are completely unrelated).
If you wish to explore the example repository, feel free to visit: https://github.com/klinki/aurelia-webpack-issue
(Also, take a look at the tag "working-state": https://github.com/klinki/aurelia-webpack-issue/tree/working-state - just one commit back and everything seems to work).