【uniapp引入unocss】

第一步

打开 vite.config.ts

import { defineConfig } from "vite";
import uni from "@dcloudio/vite-plugin-uni";
import Unocss from 'unocss/vite'
export default defineConfig({
  plugins: [uni(), Unocss()],
});

第二步

创建 unocss.config.ts

2.1 下载安装

pnpm i unocss unocss-preset-weapp

pnpm i unocss

2.2 写入下面代码

import presetWeapp from 'unocss-preset-weapp'

import { transformerClass, transformerAttributify } from 'unocss-preset-weapp/transformer';

export default ({
    presets: [
        presetWeapp()
    ],
    transformers: [
        transformerAttributify(),
        transformerClass()
    ],
    shortcuts: [
        { center: 'flex items-center justify-center' }
    ]
    
})

第三步

写入 main.ts

import { createSSRApp } from "vue";
import App from "./App.vue";
import 'uno.css'

export function createApp() {
  const app = createSSRApp(App);
  return {
    app,
  };
}

安装完成

在 index.vue里面尝试