vuepc端适配移动端

针对Vue PC端适配移动端，可以采用以下两种方法：

1.使用rem单位进行适配

可以使用引用[1]中提到的适配方案，根据浏览器可视区域自适应元素。具体实现方法是将设计稿的尺寸除以一个基准值，然后使用rem单位进行布局。在Vue项目中，可以在main.js中设置一个全局方法，用于计算rem单位的值。示例代码如下：

function setRem() {
  const baseSize = 37.5 // 设计稿尺寸除以10
  const scale = document.documentElement.clientWidth / 750 // 750为设计稿宽度
  document.documentElement.style.fontSize = baseSize * Math.min(scale, 2) + 'px'
}
setRem()
window.addEventListener('resize', setRem)

2.使用postcss-pxtorem插件进行适配

可以使用引用中提到的postcss-pxtorem插件，将px单位自动转换为rem单位。具体实现方法是在vue.config.js中配置postcss-pxtorem插件。示例代码如下：

module.exports = {
  css: {
    loaderOptions: {
      postcss: {
        plugins: [
          require('postcss-pxtorem')({
            rootValue: 37.5, // 设计稿尺寸除以10
            propList: ['*']
          })
        ]
      }
    }
  }
}