vue使用插件px转rem

在Vue2中，可以使用postcss-pxtorem插件将所有的px单位自动转换为rem单位，具体配置步骤如下：

1. 安装postcss-pxtorem插件

 npm install postcss-pxtorem

2. 在项目根目录创建.postcssrc.js文件，并添加以下内容：

module.exports = {
  "plugins": {
    "postcss-pxtorem": {
      "rootValue": 75, // 设计稿宽度/10，如750/10
      "propList": ["*"], // 需要进行rem转换的属性，*表示所有属性都需要转换
      "exclude": /node_modules/i // 排除目录，不进行转换
    }
  }
}

3. 在vue.config.js中加入postcss配置。

module.exports = {
  css: {
    loaderOptions: {
      postcss: {
        plugins: [
          require('postcss-pxtorem')({
            rootValue: 75,
            propList: ["*"],
            exclude: /node_modules/i
          })
        ]
      }
    }
  }
}