Issue
I am using the flag-icon-css package that supplies you a css "font" file and all SVGs of flags. There was an issue with the package (4x3 flags not showing properly), so I pulled all of the files out of node_modules
and fixed the issue.
I now have all of the css and flag icons under the src/assets/fonts
folder. I updated my angular.json
to reflect the changes and made sure the flag-icon-css
folder in node_modules
was deleted, but the flag icons are still saving in both the /dist
and also assets/fonts
folder.
Here is what my angular.json
was changed to:
"styles": [
"src/assets/fonts/flags/flag-icon.min.css",
"src/styles.scss"
],
"assets": [
"src/favicon.png",
"src/assets",
],
I even tried adding the full path: src/assets/fonts/flags/icons
, but it still builds them directly into the dist
folder.
Solution
All files added to "styles": []
are always moved to the top level of the root '/dist
' when builded. This is because they're global files.
More info here under "styles".
You have multiple options to solve your problem:
Remove the "src/assets/fonts/flags/flag-icon.min.css" from the "styles": [..]
array.
Option 1.
Import it into your styles.scss
like:
@import('path/outside/assets/flag-icon.min.css')
Now they should be included in your /dist/styles.css
after build. If you keep the icons inside the assets folder they will be imported to the styles.css
and /dist/assets/..
folder
Option 2
Import the icon set from your index.html
<link href="assets/fonts/flags/flag-icon.min.css" rel="stylesheet">
Answered By - Sebastian Münster
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.