uni-app封装image公共组件的方式实现整个项目自适应 DPR 加载图片，要求兼容小程序、H5和App三个平台。另外给定的资源图里有@2x、@3x，有的图片没有@1x图，请给出兼容有效写法

针对这个需求，我可以为您提供以下的解决方案：

1. 在uni-app中，可以使用uni.getImageInfo()获取到图片的宽高信息，然后根据设备的DPR动态计算出需要加载的图片资源路径。

2. 对于没有@1x图的图片，可以通过自定义组件的方式，在组件中进行判断和处理，如使用默认的图片、缩放等方式进行兼容。

具体实现可以参考以下步骤：

1. 在项目中创建image公共组件，例如：`common-image.vue`。

2. 在组件中引入DPR适配的工具类，如：`utils.js`，并且在组件的生命周期函数中计算出当前设备的DPR值。

3. 在组件中使用uni.getImageInfo()获取到图片的宽高信息，并且根据DPR值计算出需要加载的图片路径。

4. 对于没有@1x图的图片，可以在组件中使用默认的图片、缩放等方式进行兼容处理。

以下是示例代码，仅供参考：

<template>
  <image :src="imageSrc"></image>
</template>
<script>
import utils from '@/utils.js'

export default {
  props: {
    src: {
      type: String,
      required: true
    }
  },
  data() {
    return {
      imageSrc: ''
    }
  },
  created() {
    this.init()
  },
  methods: {
    async init() {
      const info = await uni.getImageInfo({
        src: this.src
      })
      const dpr = utils.getDPR()
      const suffix = `@${dpr}x`
      let src = this.src
      if (src.indexOf('@') > -1) {
        src = src.split('@')[0] + suffix + src.split('@')[1]
      } else {
        src += suffix
      }
      this.imageSrc = src
    }
  }
}
</script>

在utils.js中可以定义一个getDPR()方法，用来获取设备的DPR值，示例代码如下：

export default {
  getDPR() {
    let dpr = 1
    if (uni.getSystemInfoSync().platform === 'android') {
      dpr = uni.getSystemInfoSync().pixelRatio
      dpr = dpr >= 3 ? 3 : dpr >= 2 ? 2 : 1
    } else {
      dpr = uni.getSystemInfoSync().pixelRatio
    }
    return dpr
  }
}

这样，在使用公共组件时，只需要传入图片的路径，组件会自动根据设备的DPR值加载对应的图片资源，同时兼容小程序、H5和App三个平台。