【问题标题】:Angular 2 extend a style from styles.scssAngular 2 从 styles.scss 扩展样式
【发布时间】:2018-12-31 00:17:12
【问题描述】:

在 Angular 2 中,我的 styles.scss 文件中有一个 CSS 类:

.FirstClass {
}

我正在尝试在组件的 .SCSS 文件中扩展此类(例如:MyComponent.scss),例如:

.SecondClass {
  @extend .FirstClass;
}

我收到一条错误消息,提示找不到 .FirstClass。我是否正确假设styles.scss 中的类和样式可以全局引用?请帮帮我。

【问题讨论】:

  • 不,他们不能,你必须导入它们。
  • 你必须 @import "_styles.scss" 进入 MyComponent.scss
  • 是的,您必须使用@import 才能拥有外部文件

标签: css angular sass angular-cli angular2-template


【解决方案1】:

如果你有任何文件,并且你想在另一个文件中使用它的一个类,你必须先导入它。

styles.scss

.FirstClass{}

MyComponent.scss

@import 'styles.scss'
.SecondClass{
 @extend .FirstClass;
}

SCSS 被编译为 CSS,因此,如果您需要对文件本身进行任何与纯 css 无关的更改,则必须考虑到这一点。

【讨论】:

  • @extend .FirstClass; 中缺少句点。
  • @dAxx_ 将全局 scss 文件导入多个组件会影响应用性能(文件大小等)吗?
猜你喜欢
  • 1970-01-01
  • 2017-10-19
  • 2016-06-16
  • 1970-01-01
  • 2018-02-18
  • 2018-09-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多