npm - postcss-nested 和 autoprefixer 不工作

Question

我在 webpack 中添加了 postCSS，还添加了 postcss-simple-vars、postcss-nested 和 autoprefixer。在 webpack.config.js 我这样编码：

const path = require("path");

module.exports = {
  entry: "./app/assets/scripts/App.js", //Watch - Process and Bundel

  output: {
    //change the output path from main.js on dist to another that we want
    filename: "bundled.js",
    path: path.resolve(__dirname, "app"),
  },
  mode: "development", // to fix mode warning in terminal
  watch: true,
  module: {
    rules: [
      {
        test: /\.css$/i,
        use: [
          "style-loader",
          "css-loader",
          {
            loader: "postcss-loader",
            options: {
              postcssOptions: {
                plugins: [
                  [
                    //"postcss-preset-env",
                    require("postcss-simple-vars"),
                    require("postcss-nested"),
                    require("autoprefixer"),
                    {
                      // Options
                    },
                  ],
                ],
              },
            },
          },
        ],
      },
    ],
  },
};

但只是 postcss-simple-vars 正在工作！我尝试删除所需，将插件移动到 postcss.config.js 并添加 postcss-preset-env 但即使 postcss-simple-vars 中断也没有任何改变。

有任何想法吗？

标签： npmwebpackpostcss