vue3+vite安装postcss-pxtorem

1、安装依赖

npm install postcss-pxtorem -D

npm install amfe-flexible -D

2、配置vite.config.ts

import postCssPxToRem from "postcss-pxtorem"

export default defineConfig({

plugins: [vue()],

css: {

postcss: {

plugins: [

postCssPxToRem({

rootValue: 75, // 设计稿尺寸 1rem大小

propList: ['*'], // 需要转换的属性,这里选择全部都进行转换

})

]

}

}

})

3、main.ts导入

import 'amfe-flexible'

安装后效果 比如设计稿为750px ,在iphone6/7/8中显示的宽度为750/75,也就是10rem,此时的font-size应该为37.5px

好文阅读

评论可见,请评论后查看内容,谢谢!!!
 您阅读本篇文章共花了: