Auto import

Using auto import in Vue 3 with Vite and Nuxt 3 streamlines development by reducing boilerplate code, boosting productivity with automatic component imports, and also supporting TypeScript types.

Vue 3 + Vite

To enable auto import in a Vue 3 project using Vite, you need to configure your vite.config.ts.

// vite.config.ts
import { defineConfig } from 'vite';
import vue from '@vitejs/plugin-vue';
import vueJsx from '@vitejs/plugin-vue-jsx';
import PixelComponent from '@mekari/pixel3-auto-import';

export default defineConfig({
  plugins: [
    vue(),
    vueJsx(),
    PixelComponent(),
  ],
})

Click me to view example

Nuxt 3

To enable auto import in a Nuxt 3 project, you need to configure your nuxt.config.ts.

// nuxt.config.ts
export default defineNuxtConfig({
  modules: [
    '@mekari-pixel3/nuxt'
  ],
})

Click me to view example