jiangwei小站
48 字
1 分钟
vite vue3使用unocss

安装 unocss#

pnpm add unocss -D

vite.config.ts

import UnoCSS from "unocss/vite";

plugins: [UnoCSS()];

main.ts

import "virtual:uno.css";

安装@unocss/preset-rem-to-px

pnpm add @unocss/preset-rem-to-px -D

uno.config.js

import { defineConfig, presetAttributify, presetUno } from "unocss";
import presetRemToPx from "@unocss/preset-rem-to-px";

export default defineConfig({
  presets: [
    presetUno(),
    presetAttributify(),
    presetRemToPx({
      baseFontSize: 4,
    }),
  ],
});
<h1 class="text-24 font-bold m-10 mt-20 w-50">Hello world!</h1>

localhost:5173/__unocss