css - 将 scss 文件添加到 Stackblitz

Question

你能告诉我如何将 scss 文件添加到 stackblitz 中吗？我试过了。但它不起作用。请查看并告诉我。

我尝试添加home.html

这是元素: stackblitz

Answer 1

Scss 应该在 stackblitz 中工作:

@Component({
  selector: 'page-home',
  templateUrl: 'home.html',
  styleUrls: [ './home.scss' ] <== add this
})
export class HomePage {

喜欢的风格

 page-home {
 .buttoncls {

将不适用于默认封装(ViewEncapsulation.Emulated)，因为 page-home 不是 home 组件模板的一部分，并且angular 将 [_ngcontent-c0] 之类的属性添加到样式中。

因此我们可以将 page-home 更改为 ion-list 并查看其工作原理:

Stackblitz Example (ViewEncapsulation.Emulated)

但是我们可以禁用封装:

encapsulation: ViewEncapsulation.None

Stackblitz Example (ViewEncapsulation.None)

另请参阅此线程

https://github.com/stackblitz/core/issues/1

正如 EricSimons 9 天前评论的那样:

Hey all! We just shipped SASS and LESS support, and we also support the angular-cli.json config too :)