我想知道关于开发项目引入该组件库后的组件的适配问题,由于我的项目用了postcss-pxtorem,将px自动转成rem,导致该组件库的组件样式 也px转成 rem了。

如picker组件,在iphone X上:

image.png

在iphone 8 plus上:

image.png

2020-11-20 18:49创建
共2个回答
KN
游客KnHhFZ

另外一种方案,转换的时候排除node_modules文件夹,修改vue.config.js:

module.exports = {
  css: {
    loaderOptions: {
      // 给 sass-loader 传递选项
      scss: {
        // @/ 是 src/ 的别名
        // 注意:在 sass-loader v7 中,这个选项名是 "data"
        prependData:
          ` 
          @import "@/styles/custom_theme.scss";
          @import "@nutui/nutui/dist/styles/index.scss";
          `
      },
      postcss: {
        plugins: [
          pxtorem({
            rootValue: 37.5,
            propList: ['*'],
            exclude: 'node_modules'   // 排除node_modules,不对node_modules 中的内容进行转换
          })
        ]
      }
    }
  }
}