Vue 项目引入px2rem插件并配置

Jonescy

关注

阅读 3

2024-06-02

一、安装依赖
npm install postcss-pxtorem postcss --save-dev
二、创建一个 postcss.config.js 文件在项目根目录下,并配置 postcss-pxtorem
// postcss.config.js
module.exports = {
  plugins: {
    'postcss-pxtorem': {
      rootValue: 16, // 设计稿尺寸基准16px,通常是100px,这样会使1rem等于100px
      propList: ['*'], // 转换所有属性单位
    },
  },
};

以上步骤配置完成后,当你构建项目时,postcss-pxtorem 会自动将 CSS 文件中的像素单位(px)转换为 REM 单位。 

精彩评论(0)

0 0 举报