Hi,
I am in process of creating a Component for PowerApps. For which i need to have few images which are refernced in my CSS file. How do i import the full image folder so all my CSS reference images can be seen in component.
Hi GLMSDev,
Our build tool pcf-scripts flattern the folder structure in the output folder. However, in the next release, the build tool will preserve all relative folder structures instead to avoid confusion and dependency issues. Thanks.
@GLMSDevHi, I've just tried it out.
In my css folder I have the css file and the image, and I declare them in the manifest like this:
<resources> <code path="index.ts" order="1"/> <css path="css/TS_DataSetGrid.css" order="1" /> <img path="css/businessman3.png" /> </resources>
In my css file I use the image like this:
background-image: url("businessman3.png");
I see the image both using "npm start" and in dynamics form. You can see that there is no css folder in the structure, everything is in the root.
Hope it helps.
Best regards,
Diana
Yes i did. when i unzipped the zipped file. in the bin\debug folder. I can see all of the available images. it means it has been packaged. and then i have uploaded the same. my all other css related changes i could see but no images.
Have you referenced the images within the controlmanifest.Input.xml file. Unless the images are listed in that document they will not be copied into the component...
Hi
I have added the images in css folder and referenced them in css accordingly. when i run the "npm start " i can see the images. however, when i try and upload the same component. and then use them. these images are not available.
after uploading it to css folder. do i need to call those images using the code ? if so, how do i reference them in css. ???
Hi,
I had a similar Issue here : https://powerusers.microsoft.com/t5/PowerApps-Component-Framework/Subfolder-for-css-resources/m-p/286523
For now, the resources doesn't build the folder structure: they are flattened into the output folder.
Maybe you get to see your images referenced in the css, if the images are in the same folder as the css files. This worked for me. It seems that this will be fixed in the future.
Best regards,
Diana
hi ben,
Regarding 'The one thing I don't know is how consistent the seemingly random parent path /%7b636952333030005424%7d/ is across environments. '
We actually have exposed the API,
https://stackoverflow.com/questions/19204674/how-do-i-display-an-image-via-css-in-my-local-environment has a good quick overview of how to display an image referenced within a css style using paths relative to where the css file was.
To explicitly call display an image in your image directory within an image tax not using a relative path the end directory is something like https://site.crm?.dynamics.com/%7b636952333030005424%7d/webresources/cc_namespace.constructor/images/file.jpg
where the namespace and constructor comes from the information in the control manifest and the picture is file.jpg stored in the images folder.
The one thing I don't know is how consistent the seemingly random parent path /%7b636952333030005424%7d/ is across environments.
Do you have some sort of article or code example for it. Because i have done it but it did not take and not showing image
WarrenBelz
94
Most Valuable Professional
Michael E. Gernaey
72
Super User 2025 Season 1
mmbr1606
71
Super User 2025 Season 1