Search code examples
javascriptpolymerpolymer-3.x

Issues importing components

I am trying to import the material design component "top app bar" but when I put the following code in:

import {MDCTopAppBar} from '@material/top-app-bar/mdc-top-app-bar';

I get the following error code:

Uncaught TypeError: Failed to resolve module specifier "@material/top-app-bar/mdc-top-app-bar". Relative references must start with either "/", "./", or "../".

Any guidance on this would be appreciated. I am also very new to Polymer 3 coming from version 2 and am not used to using npm to install components and the new way of referencing so any resources on the topic that might be useful would be appreciated.

Thanks

Solution

  • Change:

    import {MDCTopAppBar} from '@material/top-app-bar/mdc-top-app-bar';

    to 

    import {MDCTopAppBar} from '@material/top-app-bar/index';

    And to import Style:

    <style>
   @import "@material/top-app-bar/mdc-top-app-bar";
</style>