{"id":22584,"library":"vite-plugin-asset-manager","title":"Vite Plugin Asset Manager","description":"A Vite plugin providing a visual asset management interface during development. Scans and catalogs images, videos, audio, fonts, documents, and data files; shows import locations, detects duplicates via MD5 hashing, and allows filtering by size/type/date. Includes a draggable floating panel, keyboard shortcuts (Alt+Shift+A), real-time updates via SSE, and bulk operations (download ZIP, copy paths, delete). Ships TypeScript types. Current version 1.0.6 (March 2025). Requires Vite >=5.0.0 and Node >=22. Peer dependency on vite (not bundled). Regular releases; actively maintained.","status":"active","version":"1.0.6","language":"javascript","source_language":"en","source_url":"https://github.com/ejirocodes/vite-plugin-asset-manager","tags":["javascript","vite","plugin","assets","manager","vite-plugin","vite-plugin-assets","vite-plugin-asset-manager","react-vite-plugin","typescript"],"install":[{"cmd":"npm install vite-plugin-asset-manager","lang":"bash","label":"npm"},{"cmd":"yarn add vite-plugin-asset-manager","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-plugin-asset-manager","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"Default export. ESM only (package type module). CJS require will fail.","wrong":"const AssetManager = require('vite-plugin-asset-manager')","symbol":"AssetManager","correct":"import AssetManager from 'vite-plugin-asset-manager'"},{"note":"Type import available; Options type exported from package.","symbol":"type AssetManagerOptions","correct":"import type { AssetManagerOptions } from 'vite-plugin-asset-manager'"},{"note":"Next.js wrapper exported from subpath; using main export will error.","wrong":"import { withAssetManager } from 'vite-plugin-asset-manager'","symbol":"withAssetManager","correct":"import { withAssetManager } from 'vite-plugin-asset-manager/next'"}],"quickstart":{"code":"// vite.config.ts\nimport { defineConfig } from 'vite'\nimport AssetManager from 'vite-plugin-asset-manager'\n\nexport default defineConfig({\n  plugins: [\n    AssetManager({\n      // Optional: customize prefix or disable auto-inject\n      prefix: '/__assets__',\n      autoInject: true,\n      // Ignore certain file patterns\n      exclude: ['**/*.map']\n    })\n  ],\n})\n\n// Access UI at /__asset_manager__/ or press Alt+Shift+A","lang":"typescript","description":"Registers the AssetManager plugin in vite.config.ts with optional configuration for prefix, auto-inject, and exclusion patterns."},"warnings":[{"fix":"Update Node to v22+ and Vite to v5+.","message":"Requires Node >=22 and Vite >=5.0.0. Older Node versions will fail to start.","severity":"breaking","affected_versions":">=1.0.0"},{"fix":"In production, the plugin logic is stripped (Vite dev-only), but ensure you don't depend on the UI outside dev mode.","message":"The plugin injects a floating icon into your development HTML. It is not removed in production builds.","severity":"gotcha","affected_versions":">=0.0.1"},{"fix":"Add exclude patterns for node_modules, build output, etc.","message":"Asset scanning uses file system watchers; might cause high CPU on projects with thousands of assets. Use `exclude` option to ignore unnecessary directories.","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Run `npm install vite-plugin-asset-manager -D` and use `import AssetManager from 'vite-plugin-asset-manager'`.","cause":"Package not installed or CJS require used instead of ESM import.","error":"Error: Cannot find module 'vite-plugin-asset-manager'"},{"fix":"Use `import AssetManager from 'vite-plugin-asset-manager'` (default export) not `import { AssetManager }`.","cause":"Default import not used; likely destructured incorrectly.","error":"TypeError: AssetManager is not a function"},{"fix":"Update Vite to version 5 or newer.","cause":"Project uses an older Vite version.","error":"Uncaught Error: Vite plugin 'vite-plugin-asset-manager' requires Vite >=5.0.0"},{"fix":"Ensure you have the package installed and only import `withAssetManager` from `'vite-plugin-asset-manager/next'` inside a Next.js configuration file.","cause":"Attempting to use Next.js integration without installing the correct subpath or from a non-Next.js project.","error":"[vite] Internal server error: Cannot find module 'vite-plugin-asset-manager/next'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}