Question

我是预处理器领域的新手。如何使用角度为7的它们，尤其是postcss和Lostgrid。

我正在尝试将this code应用于斜角。如您所见，它使用postcss-cssnext和lost-grid。

@use postcss-cssnext;
@use lost;

@lost flexbox flex;
@lost gutter 0;

//more css code

如何在我的角度应用程序中使用它们？

*编辑*

您可以在没有预处理器的情况下使用以上代码。我这样编辑代码：https://codepen.io/anon/pen/BeLWeb

Answer 1

现在，角度cli不支持构建postcss，因此您必须编写自定义webpack来处理它。

您必须使用postcss-loader软件包here

，您必须使用custom-webpack来执行此操作。可以找到示例here

替代方案：Angular提供了3个预处理的CSS，供您使用，因为ass，scss较少，因此您可以根据自己的喜好进行选择

要在预处理CSS中使用angular cli，可以使用生成新的angular cli项目

ng new my-app --style=scss

您还可以使用以下设置--style标志：

-style = scss
-style = sass
-style = less

以下是angular.json中的配置

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

您可以在示意图部分中拥有scss预处理css选项，您可以将其更改为scss，less或sass

您可以阅读本文here以了解更多信息

如何在Angle 7中使用CSS预处理器

1 个答案: