postcss-purgecss加载失败报错求助：req(...) is not a function

DevOps 小满

2026-6-13

问题

已通过yarn add @fullhuman/postcss-purgecss安装了@fullhuman/postcss-purgecss，postcss.config.js配置如下：

export default {
  plugins: {
    "postcss-flexbugs-fixes": {},
    "postcss-preset-env": {
      autoprefixer: {
        flexbox: "no-2009",
      },
      stage: 3,
    },
    "@fullhuman/postcss-purgecss": {
      content: ["./scr/**/*.erb"],
    },
  },
};

运行postcss时出现报错：

/Users/bob/Sites/Old Experiments/My Blog Bridgetown/node_modules/postcss-load-config/src/plugins.js:28

throw new Error(`Loading PostCSS Plugin failed: ${err.message}\n\n(@${file})`)
      ^

Error: Loading PostCSS Plugin failed: req(...) is not a function

参照文档配置仍出错，需排查哪些方面？

排查方向

检查版本兼容性：@fullhuman/postcss-purgecss对PostCSS版本有明确要求，比如PostCSS 8+需搭配@fullhuman/postcss-purgecss v4及以上版本。用yarn list postcss @fullhuman/postcss-purgecss查看当前版本，对照官方版本匹配规则确认是否兼容。
修正配置文件模块格式：如果项目使用CommonJS规范而非ESM，postcss.config.js不能用export default，需改为module.exports。示例：
```
module.exports = {
  plugins: {
    // 原有配置内容不变
  }
}
```

调整插件配置写法：部分PostCSS版本要求插件以函数形式传入配置，而非直接写对象。可尝试修改为数组式配置：

import purgecss from '@fullhuman/postcss-purgecss';

export default {
  plugins: [
    require('postcss-flexbugs-fixes')(),
    require('postcss-preset-env')({
      autoprefixer: { flexbox: "no-2009" },
      stage: 3
    }),
    purgecss({ content: ["./src/**/*.erb"] })
  ]
};

重新安装依赖：可能存在安装不完整或缓存问题，删除node_modules和yarn.lock后，重新执行yarn install确保依赖正确安装。
修正路径拼写：配置中content路径写的是./scr/**/*.erb，注意是src而非scr，虽然当前报错不是路径问题，但后续执行PurgeCSS会找不到文件，建议提前修正。