New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
loader
option in the application
builder does not work for *.css files.
#27433
Comments
This is working as expected when using the It's unclear if you are loading monaco styles yoursleve or it's part of the package. However, the preferred approach is to use the "styles": [
"monaco-editor/min/vs/editor/editor.main.css"
] |
I expected monaco styles to be loaded as part of the package since the css bundle is being generated by esbuild. Are these file loaders applicable for css files? Esbuild states the following:
I assume this is part of the work done by vite. |
Yes, but in some cases but it also varies however the CSS is being consumed.
Correct, which makes it not a viable option when using Can you please try to use the above |
Workaround: You can set
Not if you want to have the least amount of css/javascript downloaded per page, and the styles in question are not needed everywhere. |
Command
build, serve
Is this a regression?
The previous version in which this bug was not present was
No response
Description
When trying to import a *.css file inside a *.ts with the following syntax:
The built css file is never loaded into the application.
I was pointed out in #27414 that I should use the new
loader
however that does not seem to work.angular.json
:ng serve
output:This would be useful in order to support third party libraries that use this kind of imports like
monaco-editor
.Vite already handles this when we run
ng serve --prebundle=true
and it works when a library uses this imports, but it does not work withng build
orng serve --prebundle=false
.Also esbuild is able to handle the import (https://esbuild.github.io/content-types/#css-from-js) and generate a css bundle for all the css imports that it finds in a entry point, for example I can see it generating a
main.css
file:However, the css bundle outputted to the ./dist/** folder it is never loaded onto the app.
Minimal Reproduction
ng new my-app
cd ./my-app
Create a *.css file called "import-styles.css"
Import the file above into the main.ts or other *.ts file of the app.
ng serve
Exception or Error
No response
Your Environment
Anything else relevant?
No response
The text was updated successfully, but these errors were encountered: