Registry / web-framework / vite-static-assets-plugin

vite-static-assets-plugin

JSON →
library1.2.2jsnpmunverified

A Vite plugin (v1.2.2) that automatically scans a static assets directory (default: public), generates a TypeScript module with type-safe asset paths, directory-aware types, and a helper function for URLs. Supports recursive scanning, live HMR updates, and build-time validation. Differentiators: zero-config type generation, directory-aware generics (FilesInFolder<Dir>), and minimal overhead. Alternatives like vite-plugin-static-assets lack TypeScript-first design. Release cadence: initial release, active development.

npm install vite-static-assets-plugin
INSTALL
IMPORT
SIG · VITE-STATIC-ASSETS
V
vite-static-assets-plugin
web-frameworkjavascriptv1.2.2
Install
—
Import
—
Disk
—
Pass rate
0/ 6
Env Coverage0 / 6
glibc
18–22
musl
18–22
Install & Compatibility
Where this runs
tested against v? · npm install
Install × environment matrix
Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux
musl
node 18–223 runs
build_error
glibc
node 18–223 runs
build_error
Code
Verified usage

Verified import paths — ran on the pinned version, not inferred.

staticAssetsPlugin (default)
✓ import staticAssetsPlugin from 'vite-static-assets-plugin'
✗ import { staticAssetsPlugin } from 'vite-static-assets-plugin'
Plugin is exported as default export only. Named import will be undefined.
staticAssets
✓ import { staticAssets } from './static-assets'
✗ import { staticAssets } from 'vite-static-assets-plugin'
staticAssets is generated by the plugin in the output file, not exported by the package itself.
StaticAssetPath (type)
✓ import { StaticAssetPath } from './static-assets'
✗ import { StaticAssetPath } from 'vite-static-assets-plugin'
Type is generated by the plugin, not from the package. Path must match output file.
FilesInFolder (generic)
✓ import { FilesInFolder } from './static-assets'
Must provide a string literal directory path as generic parameter, e.g. FilesInFolder<'images/'>.

Configures the plugin in vite.config.ts and imports generated types/functions.

// vite.config.ts import { defineConfig } from 'vite'; import staticAssetsPlugin from 'vite-static-assets-plugin'; export default defineConfig({ plugins: [ staticAssetsPlugin({ directory: 'public', // default outputFile: 'static-assets.ts', // default include: ['**\/*'], // default: all files exclude: [], // default: none debounceMs: 100, // default: 100 scanDepth: 10, // default: 10 emptyDirBehaviour: 'skip', // default: skip leadingSlash: true, // default: true }) ] }); // After running Vite dev/build, import from generated file: import { staticAssets, StaticAssetPath, FilesInFolder } from './static-assets'; const url = staticAssets('images/logo.svg'); // returns '/images/logo.svg' const path: StaticAssetPath = 'fonts/roboto.woff2'; type SvgIcons = FilesInFolder<'icons/'>; // union of paths like 'icons/circle.svg' | 'icons/square.svg'
Debug
Known issues
breakingRequires Vite >=6.2.0 and TypeScript >=5.0.0
fix
Upgrade Vite to 6.2+ and TypeScript to 5.0+
affects: <1.0.0
gotchaGenerated file path is relative to project root. Ensure the output is not overwritten by other tooling.
fix
Keep outputFile default or set a unique path, and add it to .gitignore if dynamic.
affects: >=1.0.0
gotchaPlugin only processes files present during initial scan and HMR updates. Files added outside Vite's watch scope may not be picked up.
fix
Restart dev server or trigger a manual scan if needed (not currently supported).
affects: >=1.0.0
deprecatedNo known deprecated features yet; this is an initial release.
affects: >=1.0.0
Errors
Common errors & fixes
Cannot find module './static-assets' or its corresponding type declarations.
The generated file may not exist (forgot to run Vite dev/build) or the path is incorrect.
fix
Run 'vite' or 'vite build' once to generate the file, then check the output path matches your import.
TypeError: staticAssets is not a function
Importing from the wrong module (e.g., from 'vite-static-assets-plugin' instead of generated file).
fix
Import { staticAssets } from './static-assets' (or your configured output file).
TS2582: Cannot find name 'StaticAssetPath'.
Type import path is incorrect or missing generated file.
fix
Add import type { StaticAssetPath } from './static-assets'; and ensure the generated file is in your tsconfig includes.
Upgrade
Version history
1.2.2latest on npm
Audit
Dependencies
typescriptrequiredPeer dependency for type generation; plugin requires TypeScript >=5.0
viterequiredPeer dependency; requires Vite >=6.2
Agent activity
7 hits · last 30 days
node
6
OpenAI (training)
1
Resources
vite-static-assets-plugin — npm install vite-static-assets-plugin · libregistry