vue项目中px自动转换为rem

最新推荐文章于 2025-02-19 16:48:51 发布

weixin_34292924

最新推荐文章于 2025-02-19 16:48:51 发布

阅读量240

点赞数

CC 4.0 BY-SA版权

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/huanhuan55/p/9770893.html

本文介绍如何在项目中安装并配置postcss-pxtorem插件，实现px单位到rem单位的转换，适用于响应式布局。具体步骤包括安装插件、修改build/utils.js文件中的postcssLoader选项，加入rootValue和propList配置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.安装 postcss-pxtorem :  npm install postcss-pxtorem -D
2.修改 /build/utils.js 文件

找到 postcssLoader 

const postcssLoader = {
    loader: 'postcss-loader',
    options: {
          sourceMap: options.sourceMap
    }
}
修改为：

const postcssLoader = {
    loader: 'postcss-loader',
    options: {
      sourceMap: options.sourceMap,
      plugins: [
        require('postcss-pxtorem')({
          'rootValue': 32,
          propList: ['*']
        })
      ]
    }
}