如何将指定的第三方组件库px转换为rem?

现状:我们项目既有使用固定长度的px,也有用到rem进行屏幕适配。现在想要引入基于px的第三方组件库,将第三方组件库中的px转换成rem。

困惑:将px转换rem的主流方式是postcss-pxtorem,但它好像会把项目中所有的px转换成rem。使用selectorBlackList进行黑名单设置排除工作量太大,是否有某种方式可以只转换第三方组件库px为rem?

阅读 252
评论 3月26日提问
    2 个回答
          require('postcss-px-to-viewport')({
            viewportWidth: 750, // (Number) The width of the viewport.
            viewportHeight: 1334, // (Number) The height of the viewport.
            unitPrecision: 6, // (Number) The decimal numbers to allow the REM units to grow to.
            viewportUnit: 'vw', // (String) Expected units.
            selectorBlackList: ['.ignore', '.am'], // (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.
          }),

    注意上方的 selectorBlackList, am 开头的都会被忽略掉,例如:am-list ama am-table 应该是可以满足你需求的,或者你可以看看你的用法对不对

    评论 赞赏 3月26日

      只知道pxToRem插件,有个忽略转换的功能,如果单位是px就会转换成rem,单位是PX或者Px,就不转换。
      不知道这个功能能不能满足你的需求。

      评论 赞赏 3月26日
        撰写回答

        登录后参与交流、获取后续更新提醒