项目上有一个大屏是根据UI的设计稿，已经将宽高固定了，现在要求做适配，这里推荐两款用过的适配插件。

组件库地址：https://www.npmjs.com/package/v-scale-screen?activeTab=readme

v-scale-screen这个插件利用缩放进行适配，使用起来也非常的简单方便，可支持页面铺满和等比例缩放。

目前有vue2和vue3版本，对应的下载命令如下

我这里是vue2版本，所以直接在main.js中引入，注册；然后在需要适配的页面外层套vscalescreen组件，传入宽高即可实现适配，这个插件有一个缺陷，就是如果大屏上有地图，并且地图上有一些点击交互事件，由于缩放的原因，会导致事件偏移。

autofit.js也是一款可以实现自适应的库，更确切来说它是一个封装的很好的工具方法。为什么会选择这个，因为在我的大屏上有地图，地图上有图标并且有点击事件，大屏自适应后会导致事件偏移；而这个方法可以选择哪些dom进行缩放，哪些可以不缩放。

组件地址：https://github.com/Auto-Plugin/autofit.js

文档地址：https://auto-plugin.github.io/index/autofit.js/

这个组件用法非常简单

下载

导入

使用