mkdir react-pxtovw && cd react-pxtovw
yarn create umi

yarn

<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no,width=device-width">

// 引入步骤2安装的依赖们
import postcssImport from 'postcss-import';
import postcssUrl from 'postcss-url';
import postcssAspectRatioMini from 'postcss-aspect-ratio-mini';
import postcssWriteSvg from 'postcss-write-svg';
import postcsscssnext from 'postcss-cssnext';
import pxToViewPort from 'postcss-px-to-viewport';
import cssnano from 'cssnano';

const config: IConfig =  {
  // 这里省略了很多...

  // 额外的postcss插件用这个extraPostCSSPlugins：
  extraPostCSSPlugins: [
    postcssImport({}),
    postcssUrl({}),
    postcssAspectRatioMini({}),
    postcssWriteSvg({ utf8: false }),
    postcsscssnext({}),
    pxToViewPort({
      viewportWidth: 720, // (Number) The width of the viewport.
      viewportHeight: 1280, // (Number) The height of the viewport.
      unitPrecision: 3, // (Number) The decimal numbers to allow the REM units to grow to.
      viewportUnit: 'vw', // (String) Expected units.
      selectorBlackList: ['.ignore', '.hairlines'], // (Array) The selectors to ignore and leave as px.
      minPixelValue: 1, // (Number) Set the minimum pixel value to replace.
      mediaQuery: false // (Boolean) Allow px to be converted in media queries.
    }),
    cssnano({
      preset: "advanced",
      autoprefixer: false,
      "postcss-zindex": false,
      zindex: false
    })
  ],
}

<div className={styles.test}>测试</div>

.test {
  display: inline-block;
  width: 500px;
  height: 500px;
  line-height: 500px;
  text-align: center;
  color: #fff;
  background: pink;
}