一、项目配置

  1. 安装flexible

npm i lib-flexible --save

  1. 在项目入口文件 main.js 里 引入 lib-flexible

import ‘lib-flexible’

  1. public/index.html 中修改meta

  1. app.vue设置全局样式

    1. body{
    2. min-width: 320px;
    3. max-width: 560px;
    4. width: 10rem;
    5. margin: 0 auto!important;
    6. padding: 0;
    7. box-sizing: border-box;
    8. }

  2. 验证

image.png
image.png

二、编辑器配置

  1. 安装插件

名称px2rem

  1. 设置

preferences——Px to Rem
fontsize为设计稿宽度除以10
image.png

  1. 使用

ALT+D既可转换