How to auto import naive ui vue component and styles in tsx or jsx #825

import path from 'node:path';
import { NaiveUiResolver } from 'unplugin-vue-components/resolvers';
import Components from 'unplugin-vue-components/vite';

export default Components({
  dirs: ['src/components'],
  include: [/\.vue$/, /\.vue\?vue/],
  dts: path.resolve(process.cwd(), 'components.d.ts'),
  extensions: ['vue'],
  resolvers: [NaiveUiResolver()]
});

import path from 'node:path';
import AutoImport from 'unplugin-auto-import/vite';
import { NaiveUiResolver } from 'unplugin-vue-components/resolvers';

export default AutoImport({
  dts: path.resolve(process.cwd(), 'auto-imports.d.ts'),
  include: [/\.[tj]sx?$/, /\.vue$/, /\.vue\?vue/, /\.md$/],
  imports: [
    'vue',
    'vue-router',
    'vue-i18n',
    'pinia',
   
  ],
  dirs: [
    'src/constants',

  ],
  vueTemplate: true,
  eslintrc: {
    enabled: true,
    filepath: path.resolve(process.cwd(), '.eslintrc-auto-import.json')
  },
  resolvers: [NaiveUiResolver()]
});