如何使用角7的css预处理程序

Question

我是新来的预处理器世界。我如何使用它们，特别是后置和丢失网格，与角7。

我正试着在角度上应用这段代码。正如您所看到的，它使用后-cssnext和丢失栅格。

@use postcss-cssnext;
@use lost;

@lost flexbox flex;
@lost gutter 0;

//more css code

如何在我的角度应用程序中使用这些？

*编辑*

您可以使用上述代码，而不需要预处理.我编辑的代码如下：https://codepen.io/anon/pen/BeLWeb

Answer 1

现在角的cli不支持建后，所以你必须写自定义webpack来处理它。

您必须使用postcss-加载程序包这里。

你必须用风俗webpack来做这件事。示例可以找到这里

可供选择的解决方案:角提供3预处理css供您使用是sass，scss，较少，以便您可以根据您的个人喜好选择。

若要将角cli与预处理css一起使用，可以使用

ng new my-app --style=scss

您还可以使用以下内容设置-样式标志：

1. --style=scss
2. -style=sass
3. --式样=减少

下面是angular.json中的配置

  "projects": {
    "awesome": {
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "prefix": "app",
      "schematics": {
        "@schematics/angular:component": {
          "style": "scss"
        }
      },

您可以在原理图部分我有scss预处理css选项，您可以更改为scss，更少，或sass。

您可以阅读本文这里获得更多信息。