配置了这个插件，出现iphone15白边问题和定位不了的问题

[Alan-Xia]

module.exports = () => {
return {
plugins: {
'postcss-mobile-forever': {
// 应用基于该宽度进行开发，转换后的伸缩视图将会以该宽度的视图作为标准进行比例伸缩
viewportWidth: 750,
// 页面最外层选择器，例如“#app”，用于设置在桌面端和移动端横屏时的居中样式
appSelector: '#app',
// 限制视口单位的最大宽度
maxDisplayWidth: 750,
// 打开媒体查询模式，打开后将自动关闭 maxDisplayWidth
enableMediaQuery: true,
// 适配到桌面端时，展示的视图宽度
desktopWidth: 430,
// 适配到移动端横屏时，展示的视图宽度
landscapeWidth: 425,
// 高度断点，视图小于这个高度，并满足一定条件，则页面使用移动端横屏宽度，“原理和输入输出范例”一节具体介绍了该值的触发情况
// maxLandscapeDisplayHeight: 640,
// 移动端竖屏视口视图，转换成什么视口单位
// 原来的配置
viewportUnit: 'vw',
fontViewportUnit: 'vw',
// 现在的配置
// mobileUnit: 'vw',
// 单位精确到小数点后几位
unitPrecision: 3,
// 选择器黑名单，名单上的不转换
selectorBlackList: ['md-'],
// 排除文件或文件夹
exclude: [/node_modules/]
}
}
}
}

[wswmsword]

方便地话配个截图我看下。

[Alan-Xia]

[wswmsword]

这是小程序吗，我也没试过小程序用这个插件。能看到这个白边是什么样式吗，有可能不是插件的问题，插件没有额外添加边框、边距之类的属性，只有在打开 border 选项的时候会在指定的 appSelector 的样式上加一个 box-shadow。

[Alan-Xia]

这不是插件，是企业内部自己APP里面的h5微应用

[wswmsword]

好的，那这个 h5 如果不放到 APP 里，直接从浏览器访问是正常的吗？

[Alan-Xia]

浏览器访问是正常的

[wswmsword]

能看出来这个白边是什么属性导致的吗？

[Alan-Xia]

我把这个关了再试试
// 适配到桌面端时，展示的视图宽度
desktopWidth: 430,
// 适配到移动端横屏时，展示的视图宽度
landscapeWidth: 425,

[wswmsword]

ok，你现在这个是媒体查询模式，还有个 CSS 函数的模式也可以试试，大概是下面这样：

module.exports = () => {
  return {
    plugins: {
      'postcss-mobile-forever': {
        // 应用基于该宽度进行开发，转换后的伸缩视图将会以该宽度的视图作为标准进行比例伸缩
        viewportWidth: 750,
        // 页面最外层选择器，例如“#app”，用于设置在桌面端和移动端横屏时的居中样式
        appSelector: '#app',
        // 限制视口单位的最大宽度
        maxDisplayWidth: 750,
        // 选择器黑名单，名单上的不转换
        selectorBlackList: ['md-'],
        // 排除文件或文件夹
        exclude: [/node_modules/]
      }
    }
  }
}

原来你的配置应该也有点问题，maxDisplayWidth 和 enableMediaQuery、desktopWidth、landscapeWidth 不应该同时出现。

[Alan-Xia]

好的，我试试！谢谢你

[wswmsword]

不客气，有问题及时反馈。