@aippy/vite-plugins

Vite plugins collection for Aippy projects, providing asset management and component tagging capabilities.

Installation

pnpm add -D @aippy/vite-plugins

Plugins

1. Asset Constants Plugin

Generates constant references for static assets and replaces hardcoded paths.

import { assetConstantsPlugin } from '@aippy/vite-plugins/asset-constants';

export default defineConfig({
  plugins: [
    assetConstantsPlugin({
      extensions: ['.png', '.jpg', '.jpeg', '.gif', '.svg', '.mp4', '.mp3'],
      srcDir: 'src',
      outputFile: 'src/config/assets.json',
      devMode: true,
    }),
  ],
});

2. Aippy Preload Plugin

Scans build output and generates preload meta tags for assets.

import { aippyPreloadPlugin } from '@aippy/vite-plugins/aippy-preload';

export default defineConfig({
  plugins: [
    aippyPreloadPlugin({
      extensions: ['.js', '.css', '.png', '.jpg', '.svg'],
      outDir: 'dist',
      includeSubdirs: true,
    }),
  ],
});

3. Aippy Tagger Plugin

Tags React components with metadata for development tools and inspector.

import { aippyTaggerPlugin } from '@aippy/vite-plugins/aippy-tagger';

export default defineConfig({
  plugins: [aippyTaggerPlugin()],
});

All-in-One Import

import {
  assetConstantsPlugin,
  aippyPreloadPlugin,
  aippyTaggerPlugin,
} from '@aippy/vite-plugins';

Utility Functions

The package also exports utility functions that can be used independently:

import {
  processAssetURL,
  isValidAsset,
  generateConstantName,
  extractAssetsFromContent,
  findProjectRoot,
} from '@aippy/vite-plugins/utils';

// Process asset URLs
const processedUrl = processAssetURL('./image.png'); // '/image.png'

// Validate asset paths
const isValid = isValidAsset('./image.png'); // true

// Generate constant names
const constantName = generateConstantName('/image.png'); // 'IMAGE_ABCD'

// Extract assets from content
const assets = extractAssetsFromContent(htmlContent, 'html', ['.png', '.jpg']);

// Find project root
const projectRoot = findProjectRoot(); // '/path/to/project'

License

UNLICENSED - Aippy Team

Asset files

src/config/assets.json is a flat URL dictionary. The plugin writes only that file. The project-root assets-plan.json is read-only input for reserved names and implementation.path exclusions. The plugin does not validate the plan; aippy-chat does. A missing or unreadable plan does not stop the build. Invalid dictionary JSON, a plan object stored in the dictionary, or a failed dictionary/wrapper write stops the build without overwriting the file. A source file the plugin cannot parse or rewrite only logs a warning.

Import the generated map from @/config/assets. It exports the dictionary's string values. window.getReplacedAssets still mutates that object in place. Preload reads those string values and URLs in other source files, not prompts inside the plan.

Source writes the dictionary url. The build rewrites that literal to one dictionary key. A url owned by several keys uses the first key. The url may be any reference aippy-chat accepts (ValidReference): http(s), root-relative, or relative.

Version 0.4.0-dev.5 is published. The dev dist-tag points at it. latest remains 0.3.0.