导入组件时出现问题

Question

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

Answer 1

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>

Answer 2

You can use require library, which doesn't need to mention path.

Only the package name is sufficient.

var MDCTopAppBar = require('@material');