Javascript 角度2：styleUrls是相对于当前组件的吗？

使用

styleurl

向angular 2组件添加样式时遇到了一些问题

以下是我如何使用它：

路径/main.component.ts

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

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

路径/样式/样式.css

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

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

我的浏览器里什么也没发生。 我试过：

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

我也试过：

• 要使用不同的语法编写此文档，如

  。/style/style.css'

  ，

  “style/style.css”

• 将我的

  style.css

  移动到我的组件旁边

---

但是我不能让它工作。

不要使用

样式URL

。只需使用扩展名

scss

重命名样式文件即可。样式表将自动使用

因此，我的组件的文件将如下所示，并将使用以下样式：

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

---

引用官方文档：

URL相对于应用程序根目录，它通常是承载应用程序的index.html网页的位置。样式文件URL与组件文件不相关。这就是示例URL以app/开头的原因。请参见附录2，指定与组件文件相关的URL

（）。哈哈。我完全忘记了官方文件。我真丢脸，谢谢。我在这里留下这个答案，以防其他人没有阅读文档：）。如果您将

moduleId:module.id

添加到组件装饰器，URL将成为相对的。

module

通过将

ts.config

的

module

设置为commonjs来提供。不幸的是，我使用的是SytemJS，并且我已经用SystemJS构建了一个“模块加载器”，因此如果您使用的是SystemJS，我无法切换到commonjsuse“\uu moduleName”而不是module.id