pnpm add nutui-uniapp

// tsconfig.json
{
    "compilerOptions": {
        // ...
        "types": ["nutui-uniapp/global.d.ts"]
    }
}

pnpm i -D @uni-helper/vite-plugin-uni-components

// Vite中文网：https://vitejs.cn/config/
import { ConfigEnv, loadEnv, UserConfig } from 'vite';
import { resolve } from 'path';
import uni from '@dcloudio/vite-plugin-uni';
import Components from '@uni-helper/vite-plugin-uni-components';
import { NutResolver } from 'nutui-uniapp';

// https://vitejs.dev/config/
export default ({ mode }: ConfigEnv): UserConfig => {
    const root = process.cwd();
    const env = loadEnv(mode, root);
    return {
        // ...
        plugins: [
            // ...
            Components({
                resolvers: [NutResolver()],
                dirs: ['src/components', 'src/**/components'],
                dts: 'typings/components.d.ts',
            }),
            // uni 插件一定要放到后面
            uni(),
        ],
    };
};

// .npmrc
public-hoist-pattern[]=@vue*
// or
// shamefully-hoist = true

// App.vue
<style lang="scss">
    @import 'nutui-uniapp/styles/index';
</style>

// vite.config.ts
import { defineConfig } from 'vite';

// https://vitejs.dev/config/
export default defineConfig({
    // ...
    css: {
        preprocessorOptions: {
            scss: {
                additionalData: '@import "nutui-uniapp/styles/variables.scss";',
            },
        },
    },
});

<!-- pages/index/index.vue -->
<template>
    <AppProvider>
        <view class="content">
            <nut-button type="primary"> 主要按钮 </nut-button>
            <!-- ... -->
        </view>
    </AppProvider>
</template>

pnpm i -D @unocss/transformer-directives