Displaying Static Resources Image in Lightning Component
To reference a specific resource in component markup, we can use $Resource.resourceName
within an expression. resourceName
is the Name of the static resource. In a managed packaged, the resource name must include the package namespace prefix, like $Resource.yourNamespace__resourceName
.
Sample Code:
<aura:component> <!-- Stand-alone static resources image file--> <img src="{!$Resource.resourceName}"/> <!-- Stand-alone static resources image file with Namespace--> <img src="{!$Resource.yourNamespace__resourceName}"/> <!-- Asset from an archive static resource image file--> <img src="{!$Resource.resourceName + '/assets/images/logo.png'}"/> <!-- Asset from an archive static resource image file with Namespace--> <img src="{!$Resource.yourNamespace__resourceName + '/assets/images/logo.png'}"/> </aura:component>