Vue PC端分辨率自适应

因为在做超市POS收银系统的时候，遇到需要适配不同的PC端的分辨率，原来PC还能做自适应的呀，感觉发现了新大路，于是打算做一下笔记。

当然我在做的过程中也借鉴了其他大佬的写的，如：

https://blog.csdn.net/weixin_41257563/article/details/97266234

1. 先下载所需要的插件

npm i lib-flexible -S
npm i px2rem-loader -D

3. 安装好了之后还需要在项目的入口文件 main.js 里引入 lib-flexible

import 'lib-flexible'

5. vue-cli3配置方式：我是在vue.config.js里面做的配置，代码如下：

    config.module
      .rule("css")
      .test(/\.css$/)
      .oneOf("vue")
      .resourceQuery(/\?vue/)
      .use("px2rem")
      .loader("px2rem-loader")
      .options({
      
        remUnit: 192
      });
  },

7. 获取屏幕宽度，并修改宽度，自定设置屏幕的宽度，修改文件为：flexible.js
   路劲： node_modules/lib-flexible/flexible.js
   

打完收工