指南
配置
插件
API
教程
社区
指南
配置
插件
API
教程
社区
简体中文

tools.minifyCss

  • 类型： Object | Function | undefined
  • 默认值：
const defaultOptions = {
  minimizerOptions: {
    preset: [
      'default',
      {
        mergeLonghand: false,
      },
    ],
  },
};

在生产环境构建时，Modern.js 会通过 css-minimizer-webpack-plugin 对 CSS 代码进行压缩优化。可以通过 tools.minifyCss 修改 css-minimizer-webpack-plugin 的配置。

Object 类型

当 tools.minifyCss 的值为 Object 类型时，会与默认配置通过 Object.assign 合并。

例如下面修改 cssnano 的 preset 配置：

export default {
  tools: {
    minifyCss: {
      minimizerOptions: {
        preset: require.resolve('cssnano-preset-simple'),
      },
    },
  },
};

Function 类型

当 tools.minifyCss 配置为 Function 类型时，默认配置作为第一个参数传入，可以直接修改配置对象，也可以返回一个值作为最终结果。

export default {
   tools: {
    minifyCss: options => {
      options.minimizerOptions = {
        preset: require.resolve('cssnano-preset-simple'),
      },
    }
  }
};