Awesome

vite-plugin-px-rem-vw

Integrate postcss plugin pxtorem and pxtovw in vite

Install

# pnpm
pnpm add -D vite-plugin-px-rem-vw
# yarn
yarn add -D vite-plugin-px-rem-vw
# npm
npm i -D vite-plugin-px-rem-vw

Usage

// vite.config.js
import { defineConfig } from 'vite'
import pxToRemOrVwPlugin from "vite-plugin-px-rem-vw"

export default defineConfig({
  plugins: [
    pxToRemOrVwPlugin({
      type: 'rem',
      options: {
        rootValue: 20
      }
    }),
  ],
})

Options

  //pxtovw
  interface Vw {
    type: 'vw';
    options?: VwConfig;
  }
  //pxtorem
  interface Rem {
      type: 'rem';
      options?: RemConfig;
  }
  type Options = Vw | Rem;