将 scss 文件添加到 Stackblitz

2022-01-21 00:00:00 css ionic3 angular sass typescript

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

Can you tell me how to add scss file to the stackblitz. I tried that.But it is not working. Please see that and let me know.

我已尝试添加 home.html

这是项目: stackblitz

推荐答案

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] 之类的属性添加到样式中.

won't work for you with default encapsulation(ViewEncapsulation.Emulated) because page-home is not part of home component template and angular adds attribute like [_ngcontent-c0] to styles.

所以我们可以把 page-home 改成 ion-list 看看它是怎么工作的:

So we can change page-home to ion-list and see how it works:

Stackblitz 示例(ViewEncapsulation.Emulated)

但是我们可以禁用封装:

But we can disable encapsulation: 

encapsulation: ViewEncapsulation.None

Stackblitz 示例(ViewEncapsulation.None)

另请参阅此主题

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

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

As EricSimons commented 9 days ago:

大家好！我们刚刚发布了 SASS 和 LESS 支持，我们还支持angular-cli.json 配置也是 :)

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

相关文章