vue自适应图片字体大小自适应

vue 2.x 3.x都可使用

官网

postcss-pxtorem - npmA CSS post-processor that converts px to rem.. Latest version: 6.0.0, last published: 2 years ago. Start using postcss-pxtorem in your project by running `npm i postcss-pxtorem`. There are 461 other projects in the npm registry using postcss-pxtorem.https://www.npmjs.com/package/postcss-pxtorem

安装

  npm install amfe-flexible --save   ||   npm install amfe-flexible --save --force
  npm install postcss-pxtorem --save-dev  ||    npm install postcss-pxtorem --save-dev --force

新建postcss.config文件

代码

module.exports = {
    plugins: {
        autoprefixer: {},
        "postcss-pxtorem": {
            rootValue: 144, // 根据设计图尺寸写，设计图是1920，就写192
            propList: ['*'], // 需要被转换的属性
            selectorBlackList: ['el','.titles'] // 不进行px转换的选择器，不转换element的标签样式，根据自己项目需求来定义
        }
    }
}

main.js引入

import 'amfe-flexible'