Auto-import Vue components on-demand, eliminating manual imports and registration across multiple build tools.
unplugin-vue-components is a build tool plugin that automatically imports Vue components on-demand. It eliminates the need to manually import and register components in Vue files, reducing boilerplate code while keeping bundles lean through tree-shaking. The plugin works across multiple build systems including Vite, Webpack, and Rollup.
Vue developers working on projects of any size who want to reduce import boilerplate and improve developer experience, especially those using component libraries like Element Plus or Ant Design Vue.
Developers choose unplugin-vue-components because it provides seamless auto-importing across all major build tools via the unplugin framework, offers excellent TypeScript support with automatic type generation, and includes built-in resolvers for popular UI libraries.
📲 On-demand components auto importing for Vue
Open-Awesome is built by the community, for the community. Submit a project, suggest an awesome list, or help improve the catalog on GitHub.
Works seamlessly across Vite, Webpack, Rollup, and more via the unplugin framework, ensuring consistent auto-importing regardless of your build setup, as highlighted in the multi-tool support.
Automatically generates components.d.ts for full type safety with auto-imported components, requiring minimal configuration when TypeScript is installed, enhancing developer experience.
Includes built-in resolvers for popular libraries like Element Plus and Ant Design Vue, simplifying integration without manual import statements, as listed in the README.
Only imports components actually used in templates, keeping bundle sizes lean through on-demand importing, which is a core feature emphasized for optimal performance.
Requires integration with a modern build tool like Vite or Webpack, making it unsuitable for projects without such infrastructure or those using older, simpler setups.
While zero-config works for basics, tuning options for custom directories, exclusions, or specific resolvers can become intricate and error-prone, as seen in the extensive config options.
Updates can introduce breaking changes, such as the removal of CommonJS support after version 29.1.0, requiring manual migration and careful version management.