Angular 2：是相对于当前组件的styleUrls吗？

Question

使用styleUrls为我的角度2组件添加样式时遇到了一些麻烦。

以下是我如何使用它：

路径/ main.component.ts

@Component({
    selector: 'app-view',
    styleUrls: ['./styles/style.css'],
    template: //...
})

路径/风格/ style.css中

.main-wrapper {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background: red; }

我的浏览器没有任何反应。 我试过了：

• 绝对路径
• 相对于根组件的路径。

我也试过了：

• 使用'./styles/style.css'，'styles/style.css'
等不同语法编写此内容
• 将我的style.css移到我的组件旁边。

但我无法让它发挥作用。

Answer 1

请勿使用styleUrls。只需使用scss扩展名重命名样式文件即可。样式表将自动使用！

因此，我的组件的文件将是这样的，并将使用样式：

• mycomponent.ts
• mycomponent.html
• mycomponent.scss