vue-cli5.x如何实现rem适配

vue-cli5.x实现rem适配。?
使用postcss-px2rem插件时,在vue.config.js文件中应该如何配置

望采纳
可以用这个配置,在vue.config.js文件中,可以使用以下配置

module.exports = {
  css: {
    loaderOptions: {
      postcss: {
        plugins: [
          require('postcss-px2rem')({
            remUnit: 75
          })
        ]
      }
    }
  }
}

不知道你这个问题是否已经解决, 如果还没有解决的话:
  • 这篇文章:vue-cli3.0 移动端适配 rem 布局 也许有你想要的答案,你可以看看
  • 除此之外, 这篇博客: 使用vue-cli3.0搭建适配移动端的项目中的 第二部分:使用postcss-px2rem自动将css中的px转换成rem 部分也许能够解决你的问题, 你可以仔细阅读以下内容或者直接跳转源博客中阅读:

    1.安装 postcss-px2rem

    npm install postcss-px2rem --save-dev

    2.项目部署 postcss-px2rem

    在 vue.config.js 中配置(如果没有自己手动创建)

    module.exports = {
      css: {
        loaderOptions: {
          postcss: {
            // 这是rem适配的配置  注意: remUnit在这里要根据lib-flexible的规则来配制,如果您的设计稿是750px的,用75就刚刚好。
            plugins: [
              require('postcss-px2rem-exclude')({
                remUnit: 75
              })
            ]
          }
        }
      }
    }
    

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^