vue2项目postcss.config.js配置，将px转化成rem

在Vue 2项目中，要使用PostCSS将px转换成rem，你需要安装postcss-plugin-px2rem插件。以下是postcss.config.js的配置示例：

首先，安装postcss-plugin-px2rem：

npm install postcss-plugin-px2rem --save-dev

然后，在项目根目录下创建或编辑postcss.config.js文件，并配置如下：

module.exports = {
  plugins: {
    autoprefixer: {},
    "postcss-plugin-px2rem": {
      rootValue: 37.5, // 设计稿宽度/10，这里假设设计稿宽度是375px
      propList: ['*'], // 需要转换的属性，这里选择转换所有属性
      unitPrecision: 5, // 单位精度
      propWhiteList: [], // 白名单属性，如果设置后，则只转换设置的属性
      propBlackList: [], // 黑名单属性，如果设置后，则不转换设置的属性
      exclude: /(node_module)/, // 忽略转换正则匹配的文件目录
      selectorBlackList: [], // 要忽略并保留为px的选择器
      ignoreIdentifier: false, // 忽略单个属性的转换
      replace: true, // 是否直接更换属性值，而不添加backup属性
      mediaQuery: false, // 是否处理媒体查询中的px
      minPixelValue: 0 // 设置要转换的最小像素值，如果设置为1，则只有大于1px的px单位会被转换
    }
  }
};

配置完成后，重新运行项目，PostCSS会自动将CSS中的px单位转换成相应的rem单位。