How to use latest Lightning design styles in component?

Question

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.

Answer 1

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" />