为什么 mdc-top-app-bar 不显示正确的 MDC答案

【问题标题】：Why does mdc-top-app-bar is not show correct MDC为什么 mdc-top-app-bar 不显示正确的 MDC
【发布时间】：2020-03-21 05:50:04
【问题描述】：

你能告诉我哪里出错了吗？我想使用mdc-top-app-bar，但它不起作用。

我的模块结构：.html、.scss、.ts、.spec

header.component.html

<header class=" mdc-top-app-bar">
  <div class="mdc-top-app-bar__row">
    <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-start">
      <button class="mdc-icon-button material-icons mdc-top-app-bar__navigation-icon--unbounded">menu</button><span class="mdc-top-app-bar__title">San Francisco, CA</span> </section>
    <section class="mdc-top-app-bar__section mdc-top-app-bar__section--align-end">
      <button class="mdc-icon-button material-icons mdc-top-app-bar__action-item--unbounded" aria-label="Download">file_download</button>
      <button class="mdc-icon-button material-icons mdc-top-app-bar__action-item--unbounded" aria-label="Print this page">print</button>
      <button class="mdc-icon-button material-icons mdc-top-app-bar__action-item--unbounded" aria-label="Bookmark this page">bookmark</button>
    </section>
  </div>
</header>

这是我的 .ts 文件

import { Component, OnInit } from '@angular/core';
import {MDCTopAppBar} from '@material/top-app-bar';

@Component({
  selector: 'app-header',
  templateUrl: './header.component.html',
  styleUrls: ['./header.component.scss']
})
export class HeaderComponent implements OnInit {

  constructor() { }

  ngOnInit(): void {
    const topAppBarElement = document.querySelector('.mdc-top-app-bar');
    const topAppBar = new MDCTopAppBar(topAppBarElement);
  }
}

这就是我的代码的样子 ;)

我在 .scss 文件中使用它

@use "@material/top-app-bar/mdc-top-app-bar";
@use "@material/icon-button/mdc-icon-button";

但我得到错误

ERROR in Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Can't find stylesheet to import.
   ╷
23 │ @use "@material/elevation/mixins" as elevation-mixins;
   │ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
   ╵
  node_modules\@material\top-app-bar\mdc-top-app-bar.scss 23:1  @use
  C:\Users\\CarApp\car-shareing-app\src\app\modules\home\components\car-dictionary\car-dictionary-list\car-dictionary-list.component.scss 1:1                                                     root stylesheet

【问题讨论】：

标签： angular material-design

【解决方案1】：

好的。我发现解决方案 mdc-top-app-bar 有问题，google 没有修复 :( File to import not found or unreadable 我会选择另一个导航工具

【讨论】：