vite移动端项目的移动端适配

第一步

下载flexible插件

npm i amfe-flexible postcss-pxtorem -D

第二步

在配置文件中vite.config.ts输入

const postCssPxToRem = require("postcss-pxtorem")

export default defineConfig({
  plugins: [react()],
  css: {
    postcss: {
      plugins: [
        postCssPxToRem({
          rootValue: 37.5, // 1rem的大小
          propList: ['*'], // 需要转换的属性，这里选择全部都进行转换
        })
      ]
    },
  }
})

第三步

在主路口main中引入

import 'amfe-flexible'

以上是react项目，vue同样适用，第二步的配置文件不同罢了，加的代码都一样