pc 自适应方案

780 阅读1分钟

使用插件

postcss-px-to-viewport npm地址: https://www.npmjs.com/package/postcss-px-to-viewport

1、vue-cli3中使用 在vue.config.js中添加如下代码:

module.exports = {
     css: {
        loaderOptions: {
          postcss: {
            plugins: [
              require("postcss-px-to-viewport")({
                unitToConvert: "px",
                viewportWidth: 1920,
                unitPrecision: 3,
                propList: [
                  "*"
                ],
                viewportUnit: "vw",
                fontViewportUnit: "vw",
                selectorBlackList: [],
                minPixelValue: 1,
                mediaQuery: false,
                replace: true,
                exclude: /(\/|\\)(node_modules)(\/|\\)/,
              })
            ]
          }
        }
  }
}