0

I have a lightning component as below on Opportunity standard lightning page.

Example.cmp:

<aura:component 
    implements="force:appHostable,flexipage:availableForAllPageTypes,force:hasRecordId" 
    access="GLOBAL">
    <c:svgComponent 
        xlinkHref="/resource/SLDS212/assets/icons/standard-sprite/svg/symbols.svg#product" 
        class="slds-icon" />
</aura:component>

svgComponent.cmp:

<aura:component >
  <aura:attribute name="class" type="String"/>
  <aura:attribute name="xlinkHref" type="String"/>
  <aura:attribute name="ariaHidden" type="String" default="true"/>
</aura:component>

Also, I have a static resource uploaded with name SLDS212.

For every release, I go to Downloads - Lightning Design Systems, download new file and upload to static resource and update my components.

Is there a better way to do this, instead of downloading the styles sheet for every release and uploading?

Please note that there is no <aura:application> involved here.

3

Cascading Style Sheets "cascade", meaning that since LEX uses SLDS, you don't need to import the styles a second time. Simply assume that they exist and work correctly. When possible, use standard components with standard documented values; if SLDS changes, those components will take on the new styles as well.


For example, svgComponent has been deprecated, and it is expected that you will use lightning:icon or one of the other variants, such as lightning:buttonIcon if you need an icon button:

<lightning:icon iconName="standard:product" />
3
  • So what should I pass for xlinkHref attribute in my example? – javanoob Jun 15 '18 at 20:04
  • @javanoob In your specific case, use the standard lightning:icon component, such as <lightning:icon iconName="standard:product" />. – sfdcfox Jun 15 '18 at 20:06
  • 2
    @javanoob Also, as an aside, Salesforce specifically recommends that you do not use svgIcon, but instead use the standard component. – sfdcfox Jun 15 '18 at 20:09

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.