tools.postcss

  • Type: Object | Function
  • Default:
const defaultOptions = {
  postcssOptions: {
    plugins: [
      // 以下插件默认启用
      require('postcss-nesting'),
      require('postcss-media-minmax'),
      require('postcss-flexbugs-fixes'),
      require('autoprefixer')({
        flexbox: 'no-2009',
      }),
      // 以下插件仅在需要兼容低版本浏览器时启用
      require('postcss-custom-properties'),
      require('postcss-initial'),
      require('postcss-page-break'),
      require('postcss-font-variant'),
    ],
    // 默认在开发环境下启用 CSS 的 Source Map
    sourceMap: isDev,
  },
};

Modern.js integrates PostCSS by default, you can configure postcss-loader through tools.postcss.

INFO

The usage of this configuration item is exactly the same as that of Rsbuild. For detailed information, please refer to Rsbuild - tools.postcss.