Angular预制主题不适用于Angular8库

预构建的Angular Material Theme在库中的工作方式与在角度应用程序中不同。在projects / example-lib文件夹中创建了一个style.css文件,并在其中导入了预先构建的靛蓝粉色主题。根据文档,我应该将其包含在angular.json文件中,但是这样做时,出现以下错误

Schema validation failed with the following errors:
  Data path "" should NOT have additional properties(styles).

Angular Material设计组件(Mat-Tabs等)在我的库中可用,但是 Angular Material主题不起作用。我还尝试将以下内容添加到我的styles.css中,

@import "~@angular/material/prebuilt-themes/indigo-pink.css"; 

这也不起作用。我认为由于style.css文件未全局定义,因此未应用预建主题。还向库的根组件添加了ViewEncapsulation.None来删除封装。它似乎对我不起作用。

a405387759 回答:Angular预制主题不适用于Angular8库

这是从有角度的材料网站上获得的,可能会有帮助:

  

最后,如果您的应用程序内容未放置在mat-sidenav-container元素内,则需要将mat-app-background类添加到包装器元素(例如body)中。这样可以确保将正确的主题背景应用于您的页面。

,

角度预建主题不适用于图书馆,因为它不是全局定义的。基本上,这意味着我的样式表未在angular.json文件的styles []中输入。 以下解决方案非常适用于全局定义样式 https://medium.com/@Dor3nz/compiling-css-in-new-angular-6-libraries-26f80274d8e5

  1. 安装ng-packagr,scss-bundle和ts-node
  2. 创建一个css-bundle.ts https://gist.github.com/Dor3nz/2a33196d2f4b0db7d5ac5904941f5a1b#file-css-bundle-ts
  3. 在库的/ src目录中添加_theme.scss,该库实际上包含并导入了我们要捆绑的所有css。
  4. 添加postbuild npm脚本以运行css-bundle.ts
  5. 将其包含在angular.json中的应用程序的样式标签中
本文链接:https://www.f2er.com/3048098.html

大家都在问