postcss-px-to-viewport安装

要安装postcss-px-to-viewport插件，你可以按照以下步骤进行操作：

1. 在你的项目目录下，打开终端或命令行工具。
2. 确保你已经在项目中安装了PostCSS和PostCSS Loader。如果没有安装，可以使用以下命令进行安装：

npm install postcss postcss-loader --save-dev

3. 安装postcss-px-to-viewport插件：

npm install postcss-px-to-viewport --save-dev

4. 在你的项目根目录下创建一个postcss.config.js文件，并添加以下内容：

module.exports = {
  plugins: [
    require('postcss-px-to-viewport')({
      viewportWidth: 750, // 视口的宽度，单位px
      viewportHeight: 1334, // 视口的高度，单位px
      unitPrecision: 3, // px转换为视口单位值的小数位数
      viewportUnit: 'vw', // 要转换成的视口单位
      selectorBlackList: ['.ignore', '.hairlines'], // 不进行转换的CSS选择器
      minPixelValue: 1, // 小于或等于1px不转换为视口单位
      mediaQuery: false // 允许在媒体查询中转换px
    })
  ]
};

5. 根据你的项目配置PostCSS Loader。在webpack配置文件中，找到关于PostCSS Loader的配置，并添加以下内容：

module: {
  rules: [
    {
      test: /\.css$/,
      use: [
        'style-loader',
        'css-loader',
        {
          loader: 'postcss-loader',
          options: {
            postcssOptions: {
              config: 'postcss.config.js'
            }
          }
        }
      ]
    }
  ]
}

6. 运行你的项目，postcss-px-to-viewport插件会自动将CSS中的px单位转换为视口单位。

这样，你就成功地安装和配置了postcss-px-to-viewport插件。记得根据你的项目需求调整postcss.config.js中的配置参数。祝你使用愉快！如有其他问题，请随时向我提问。