Does anyone know how can I use the Google Material design in the Aura Components? I have included all the required file like fonts, icons, css and js from the static resource.

But, when i try to add mdl class on any element it throws an Error saying :

Uncaught Error: Invalid argument provided to upgrade MDL element.
throws at /resource/1488398752000/mdl/material.min.js:10:2389

I have also tried using materialize and Angular Material, but nothing worked.

This is the code i am using right now:

<aura:component description="MaterialDesign">
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <ltng:require styles="{!join(',',
        $Resource.iconfont + '/iconfont/material-icons.css',
        $Resource.mdl + '/material.min.css'
        scripts="{!$Resource.mdl + '/material.min.js'}"
        afterScriptsLoaded="{!c.materialDesignLoaded}" />
     <ui:button class="mdl-button mdl-js-button mdl-button--fab mdl-js-ripple-effect mdl-button--colored">
        <i class="material-icons">add</i>

Here is the image of what error it show when i try to use materializecss.

enter image description here

  • Did you ever figure out how to do this? – slashApex Jun 4 '19 at 19:47

Your Answer

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

Browse other questions tagged or ask your own question.