pc端适配

53 阅读1分钟

说明:vue3+vite下对屏幕进行适配 1.下载包

npm i postcss-pxtorem -D

2.在根目录下新建一个postcss.config.js文件,下面提供了一份基本的 PostCSS 示例配置,可以在此配置的基础上根据项目需求进行修改。

// postcss.config.js
module.exports = {
  plugins: {
    'postcss-pxtorem': {
      rootValue: 37.5,//设计图宽度/10
      propList: ['*'],
    },
  },
};

3.将index.js改名为flexible.js,放在根目录下

git clone https://gitee.com/aonu/lib-flexible.git

cc9186dd92ad5a73c70bc74d3fb7353.png

21c20d8b3c78925fbb0e67e7329ba72.png 4.在index.html文件下引入

 <!-- 引入flexible.js文件 -->
    <script src="./flexible.js"></script>

9f7719fe0f95f60888d4a4bb64c4ef8.png 5.完成适配