0

我的 webpack 配置中有带有 cssnano 插件的 postcss。这是配置的一部分：

{
  test: /\.s[ac]ss$/i,
  use: [MiniCssExtractPlugin.loader, "css-loader", postcssWithCssnanoLoader, "sass-loader"]
},

我发现 postcss 转换适用于每个 scss/css 模块。例如：

//file1.scss
.some-class{
    width: 100px;
}
.some-class{
    height: 100px;
}

//final css
.some-class {
    width: 100px;
    height: 100px;
}

但是如果还有一个 scss 文件：

//file2.scss
.some-class{
    background: black;
}
.some-class{
    color: white;
}

//final css
.some-class {
    width: 100px;
    height: 100px;
}
.some-class {
    background: black;
    color: white;
}

由于配置和 webpack 的工作方式，这是有道理的。但是如何将 postcss 转换应用于整个 CSS 包？我想要以下结果：

//final css
.some-class {
    width: 100px;
    height: 100px;
    background: black;
    color: white;
}

我已经尝试过了（有点成功的希望）：

    {
        test: /\.s[ac]ss$/i,
        use: [
          MiniCssExtractPlugin.loader,
          postcssWithCssnanoLoader,
          { loader: MiniCssExtractPlugin.loader, options: { emit: false } },
          "css-loader",
          "sass-loader"
        ]
    }

显然，这是行不通的。

4

0 回答 0