How could I access the image which is inside the .zip and inside the folder in which name the spaces are present in lightning?

For example, I have no problems accessing the following static resource:

$Resource.tF + '/f1/f2/testImg.png'

But I really can not access

$Resource.tF + '/f1/f 2/testImg.png'

Even when I try:

$Resource.tF + '/f1/f_2/testImg.png'

I was able to find nothing about the naming conventions in the case the only solution seems to be is to name the folders inside the .zip without any spaces.

  • 2
    What do you mean by "draw the PNG"? Are you trying to display it in your component?
    – David Reed
    Commented May 27, 2018 at 16:40
  • If you're trying to display it, use it in the <img> tag as mentioned: <img src="{!$Resource.SLDSv2 + '/assets/images/avatar1.jpg'}"/>. You said you'd want it in Javascript, and it'll give you access to the URL of the image and not the image itself. Perhaps, put it in an <img> tag and access that from javascript to get hold of it and you can then add relevant styling?
    – markgarg
    Commented May 27, 2018 at 16:57
  • @RohitKunal, I updated the question drastically, Please, check it out. Commented May 27, 2018 at 18:15

1 Answer 1


I had the same experience lately, So I avoid using spaces in my asset names when I upload them to static resources. Nothing I have tried has worked, so my suggestions is to simply avoid spaces (as you are already doing) since not even an encoded space value works when trying to referencce them.

Does not work:

 <img src="{!$Resource.atst + '/tstAsst/live site.svg'}"/>
 <img src="{!$Resource.atst + '/tstAsst/live_site.svg'}"/>
 <img src="{!$Resource.atst + '/tstAsst/live%20site.svg'}"/>

live site.svg should be named live_site.svg OR liveSite.svg to avoid this issue.

  • 1
    I was just typing that myself. Note that this limitation also applies to Visualforce.
    – sfdcfox
    Commented May 27, 2018 at 19:24

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .