Angular 未应用角度材质样式

我正在运行节点12.18.2 我安装了Angular CLI的最新版本（10.0.2）

我创建了一个新应用程序（ng new app_NAME）； 我安装了角材料（ng添加角/材料）

然后我尝试显示一些按钮，这是我得到的：

这是我的配置：

package.json：

    {
    "dependencies": {
      "@angular/animations": "~10.0.3",
      "@angular/cdk": "^10.0.1",
      "@angular/common": "~10.0.3",
      "@angular/compiler": "~10.0.3",
      "@angular/core": "~10.0.3",
      "@angular/forms": "~10.0.3",
      "@angular/material": "^10.0.1",
      "@angular/platform-browser": "~10.0.3",
      "@angular/platform-browser-dynamic": "~10.0.3",
      "@angular/router": "~10.0.3",
      "rxjs": "~6.5.5",
      "tslib": "^2.0.0",
      "zone.js": "~0.10.3"
      },
    "devDependencies": {
      "@angular-devkit/build-angular": "~0.1000.2", 
      "@angular/cli": "~10.0.2",
      "@angular/compiler-cli": "~10.0.3",
      "@types/node": "^12.11.1",
      "@types/jasmine": "~3.5.0",
      "@types/jasminewd2": "~2.0.3",
      "codelyzer": "^6.0.0",
      "jasmine-core": "~3.5.0",
      "jasmine-spec-reporter": "~5.0.0",
      "karma": "~5.0.0",
      "karma-chrome-launcher": "~3.1.0",
      "karma-coverage-istanbul-reporter": "~3.0.2",
      "karma-jasmine": "~3.3.0",
      "karma-jasmine-html-reporter": "^1.5.0",
      "protractor": "~7.0.0",
      "ts-node": "~8.3.0",
      "tslint": "~6.1.0",
      "typescript": "~3.9.5"
     }

angular.json：

"styles": [
             "./node_modules/@angular/material/prebuilt-themes/indigo-pink.css",
             "src/styles.scss"
           ],

我在styles.scss文件中添加了以下内容：

@import '~@angular/material/prebuilt-themes/deeppurple-amber.css';

我希望按钮看起来像这样： 我遗漏了什么？

以下是关于工作风格的说明。也许您必须将

MatDividerModule、MatIconModule、MatButtonModule

添加到您的模块中

@NgModule({
导入：[BrowserModule、FormsModule、MatDividerModule、MatIconModule、MatButtonModule]，
声明：[AppComponent，HelloComponent]，
引导：[AppComponent]
})
导出类AppModule{}

如果成功加载任何材质css，请检查您的开发工具。如果将css包含放在index.html中，会发生什么情况，如：