我只需要为一个组件导入 ignite-ui 样式。
组件:
@Component({
selector: 'app-detailed-report',
templateUrl: './detailed-report.component.html',
styleUrls: ['./detailed-report.component.css'],
encapsulation: ViewEncapsulation.ShadowDom
})
CSS:
@import "../../../../../../../../node_modules/igniteui-angular/styles/igniteui-angular.css";
或
@import "~igniteui-angular/styles/igniteui-angular.css";
这是行不通的。但是,如果我将 encapsulation: ViewEncapsulation.ShadowDom
更改为 encapsulation: ViewEncapsulation.None
,则会应用样式。但是,如果我转到其他组件,这些样式也会应用于它们。我只需要为一个组件应用样式
最佳答案
@Component({
selector: 'app-detailed-report',
templateUrl: './detailed-report.component.html',
styleUrls: [
'./detailed-report.component.css',
'../../../../../../../../node_modules/igniteui-angular/styles/igniteui-angular.css' // make sure it's the right path
],
encapsulation: ViewEncapsulation.ShadowDom
})
或者切换到scss
并在样式文件中导入
@import "~igniteui-angular/styles/igniteui-angular.css";
css
没有导入语句
关于css - 如何将CSS仅导入一个组件?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56593782/