带有 Bootstrap 的 Angular 4 - LESS/SASS答案

【问题标题】：Angular 4 with Bootstrap - LESS/SASS带有 Bootstrap 的 Angular 4 - LESS/SASS
【发布时间】：2018-03-28 01:23:10
【问题描述】：

我正在使用 Angular 中的引导程序。

由于我们在 Angular 中的每个组件旁边都有 css 文件，所以我想知道 SASS/LESS 扮演什么角色。例如。如果我尝试将 LESS/SASS 合并到我的 Angular 应用程序中，我会逆流而上吗？

【问题讨论】：

完全没有，如果您使用的是 Angular cli，它内置了 css 处理器来转译 less/sass。例如，在我的项目中，我使用 bootstrap 3 css + 我的自定义 less
不确定这是否可以开箱即用，但我将一些文件从 css 重命名为 scss，因为我希望在某些组件中获得一些“继承”，并且它们可以继续工作而无需触及其他任何东西。编辑：@LLai 确认它是内置的，如果您使用的是 ng cli :)
绝对不是，在您的应用程序中使用 SASS/LESS 是一个好主意。您只需要设置一个流程来编译和输出您的 SASS/LESS 文件。我会推荐 gulp。

标签： angular twitter-bootstrap-3 sass less

【解决方案1】：

使用 sass 或更少绝对是个好主意。在因素 Agnular CLI 支持它。如果你使用 Angular CLI，你可以告诉它使用 sass 而不是 css。这是来自 scotch.io（我的最爱之一）关于在 Angular CLI 中使用 sass 的文章。通常，要开始使用 sass 的 Angular 应用程序，请使用以下命令。

ng new my-app --style=scss

如果要更新现有的 css 应用程序，可以运行以下命令来更新默认值。

ng set defaults.styleExt scss

从那里，您需要将 .css 文件的名称更新为 .scss。那你应该很好。

【讨论】：