Hey there! I'm currently facing an issue while trying to build my angular project. In the project, I am using scss with assets, and below is a snippet of how I have defined the background image:
.ciao {
background-image: url("../../assets/images/bck--registration-company.png");
}
When running the following code:
ng build --prod --configuration=coll --base-href ./
I find the file "bck--registration-company.png" within the dist folder, located in the same directory as index.html. Additionally, there is another "bck--registration-company.png" inside the "assets" folder, which has me wanting to utilize resources from this folder.
I've experimented with various modifications such as changing the base href and altering the relative/absolute image paths, but without any success. Here's an example:
.background--image-carousel2{
background-image: url("/assets/images/carousel2.jpg");
}
However, this path results in a REQUEST URL as follows:
Request URL: http://localhost:63342/assets/images/carousel2.jpg
This URL is incorrect as it should ideally be:
http://localhost:63342/project/dist/name_project/assets/images/bck--registration-company.png
In my angular.json configuration, you can find the following setup:
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/name_project",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.app.json",
"assets": [
"src/assets"
],
"styles": [
"src/styles.scss"
],
"scripts": [
]
},
If you have any insights on how I could resolve this matter, I would greatly appreciate your help. Thank you!