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

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

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

阅读 5k
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 应该是可以满足你需求的,或者你可以看看你的用法对不对

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

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题