unplugin/unplugin-vue-components
Unplugin Vue Components
unplugin-vue-components is a build tool that automatically imports and registers Vue components used in templates, eliminating the need for manual import statements. It functions as a plugin for various bundlers, including Vite and Webpack, to resolve and inject component dependencies during the compilation process.
The project features a mapping system that identifies and imports components from popular third-party Vue interface libraries. This resolution logic can be extended via custom resolver extensions to modify how specific UI libraries are discovered and imported.
To maintain type safety, the tool includes a TypeScript type generator that creates global declaration files. These files provide autocompletion and type checking for components that are loaded without explicit imports.
Features
- Automatic Component Imports - Automatically resolves and imports Vue components used in templates to eliminate manual import boilerplate.
- AST-Based Source Injections - Implements build-time AST modification to automate the injection of component registration and import statements.
- Component-to-File Mappings - Provides a mapping system that resolves component names to their actual source file paths within libraries.
- Template Scan Importers - Analyzes Vue templates to automatically identify used components and insert necessary import statements.
- UI Library Resolvers - Resolves component imports from external libraries using custom mapping to simplify asset loading.
- TypeScript Type Generators - Creates TypeScript declaration files to provide autocompletion for components loaded without explicit imports.
- Custom Resolver Extensions - Allows integrating external resolver packages to customize how specific UI libraries are discovered and imported.
- TypeScript Declaration Generators - Automatically generates global TypeScript declaration files to provide autocompletion and type checking for auto-imported components.
- Vue Build Pipeline Optimizations - Optimizes the Vue build pipeline by shifting component resolution and registration from manual templates to the build process.
- Component Type Definitions - Generates type definitions for auto-imported components to enable safe property and event usage in the editor.
- Third-Party Library Integrations - Provides built-in resolvers to automatically identify and import components from popular third-party Vue interface libraries.
- Global Component Registration - Adds TypeScript definitions for components registered globally by external libraries to avoid redundant imports.
- Vite Integrations - Functions as a plugin for Vite and Webpack to resolve and inject component dependencies during compilation.
- Hook-Based Plugin Systems - Implements a hook-based system that allows the same logic to operate across different bundlers like Vite and Webpack.
- Automated UI Library Integration - Integrates third-party component libraries into Vue projects by automatically resolving assets based on template usage.
- Global Component Type Definitions - Injects global component definitions into the TypeScript environment to prevent type errors for auto-registered components.
- Vue.js Component Development - Automates the import and registration of Vue components to streamline the development of single-file components.
- Vue TypeScript Integrations - Integrates TypeScript with Vue by generating type definitions for components that are auto-imported.
- Developer Utilities - On-demand component auto-importing.
Star history
How this analysis was created: This summary and feature list are AI-generated from collected project material and can contain mistakes. Stars, license and language are imported from GitHub. Inclusion does not mean that we have tested or audited this project. Check the source documentation for any feature you depend on. Learn more on our About page.
