首页 文章

Angular 2 Component Styles无法解析来自node_modules的css导入

提问于
浏览 次
1

基于Angular Component Styles下的文档，我试图导入在node_modules下找到的样式表;即：

test.component.css：

@import '~@angular/material/core/theming/all-theme.css';

由此定义组件：

@Component({
    moduleId: module.id,
    selector: 'app-test',
    templateUrl: 'test.component.html',
    styleUrls: ['test.component.css'],
    encapsulation: ViewEncapsulation.None
})
export class TestComponent {
}

不幸的是，浏览页面时，无法找到~@angular/material/core/theming/all-theme.css .

该项目是使用Angular-Cli Build 的 .

我想我可以复制样式，并以这种方式引用它们，但我宁愿将库依赖项分开 .

javascript css angular

2 回答

  • 2

    问题在于文件扩展名 . 您正在使用扩展名 css ，它不支持从其他位置导入文件，更好的方法是将扩展名更改为 scss . 在此，您可以从 node_modules 导入文件 .

    回复于
  • -1

    如果要包含节点模块文件夹中的任何样式表，则只需将其添加到.angular-cli.json中

    "styles": [
    "../node_modules/bootstrap/scss/bootstrap.scss"
]

    在使用某些第三方插件或添加一些随机css动态创建html之前，您不需要添加 encapsulation:ViewEncapsulation.None .

    你总是可以使用.angular-cli.json中包含的全局css

    回复于

相关问题