Vite bundler for Nuxt applications providing seamless integration between Nuxt's framework and Vite's build system
—
Quality
Pending
Does it follow best practices?
Impact
Pending
No eval scenarios have been run
Comprehensive Vite plugin system providing specialized functionality for Nuxt applications, including SSR styles, asset handling, and development tools.
Manages CSS extraction and inlining for server-side rendering with sophisticated style optimization.
/**
* SSR styles plugin for CSS extraction and inlining
* Handles CSS processing for both server and client builds with style optimization
* @param options - Plugin configuration options
* @returns Vite plugin instance for SSR style handling
*/
function SSRStylesPlugin(options: SSRStylesPluginOptions): Plugin;
interface SSRStylesPluginOptions {
/** Source directory path for relative path resolution */
srcDir: string;
/** Set of chunk IDs that should have CSS inlined */
chunksWithInlinedCSS: Set<string>;
/** Function or boolean determining if styles should be inlined */
shouldInline?: ((id?: string) => boolean) | boolean;
/** Array of Nuxt component definitions */
components: Component[];
/** Mapping of CSS files to client chunks */
clientCSSMap: Record<string, Set<string>>;
/** Application entry point file */
entry: string;
/** Global CSS file paths */
globalCSS: string[];
/** Build mode: server or client */
mode: 'server' | 'client';
}Usage Example:
import { SSRStylesPlugin } from "@nuxt/vite-builder/plugins/ssr-styles";
// Used internally by Nuxt's build process
const plugin = SSRStylesPlugin({
srcDir: nuxt.options.srcDir,
chunksWithInlinedCSS: new Set(),
shouldInline: nuxt.options.features.inlineStyles,
components: nuxt.apps.default!.components || [],
globalCSS: nuxt.options.css,
mode: 'client',
entry: ctx.entry,
clientCSSMap: {}
});Handles public asset resolution and URL rewriting for different deployment environments.
/**
* Public directories plugin for asset resolution
* Manages public asset serving and URL resolution in development and production
* @param options - Plugin configuration options
* @returns Array of Vite plugin instances for public asset handling
*/
function PublicDirsPlugin(options: VitePublicDirsPluginOptions): Plugin[];
interface VitePublicDirsPluginOptions {
/** Development mode flag */
dev?: boolean;
/** Base URL for public assets */
baseURL?: string;
}Plugin Features:
Specialized plugin for handling styles during SSR development with hot updates.
/**
* Development style SSR plugin for client builds
* Handles style processing during development with hot module replacement
* @param options - Plugin configuration
* @returns Vite plugin instance
*/
function DevStyleSSRPlugin(options: {
/** Source directory path */
srcDir: string;
/** Build assets URL for CSS references */
buildAssetsURL: string;
}): Plugin;Manages runtime path resolution for assets and modules in different environments.
/**
* Runtime paths plugin for asset URL resolution
* Provides runtime path resolution for assets and modules
* @returns Vite plugin instance
*/
function RuntimePathsPlugin(): Plugin;Path Resolution Features:
Integrates TypeScript type checking into the build process with configurable options.
/**
* TypeScript type checking plugin
* Integrates TypeScript type checking into Vite build process
* @param nuxt - Nuxt instance with TypeScript configuration
* @returns Vite plugin instance
*/
function TypeCheckPlugin(nuxt: Nuxt): Plugin;Type Checking Features:
Adds polyfill support for module preloading in browsers that don't support it natively.
/**
* Module preload polyfill for older browsers
* Adds polyfill for module preloading in unsupported browsers
* @returns Vite plugin instance
*/
function ModulePreloadPolyfillPlugin(): Plugin;Ensures stable entry point hashing for better caching and deployment consistency.
/**
* Stable entry plugin for consistent chunk hashing
* Provides stable hashing for entry points to improve caching
* @param nuxt - Nuxt instance
* @returns Vite plugin instance
*/
function StableEntryPlugin(nuxt: Nuxt): Plugin;Preserves sourcemap information through the build pipeline for debugging.
/**
* Sourcemap preserver plugin for build pipeline integration
* Preserves sourcemap information through Nitro build process
* @param nuxt - Nuxt instance
* @returns Vite plugin instance
*/
function SourcemapPreserverPlugin(nuxt: Nuxt): Plugin;Manages Vue-specific feature flags and compilation options.
/**
* Vue feature flags plugin for server builds
* Manages Vue compilation feature flags and optimization
* @param nuxt - Nuxt instance
* @returns Vite plugin instance
*/
function VueFeatureFlagsPlugin(nuxt: Nuxt): Plugin;Provides bundle analysis and visualization capabilities for production builds.
/**
* Analyze plugin for bundle visualization
* Generates bundle analysis reports for optimization insights
* @param nuxt - Nuxt instance with analysis configuration
* @returns Promise resolving to array of Vite plugins
*/
function AnalyzePlugin(nuxt: Nuxt): Promise<Plugin[]>;Analysis Features:
Integrates vite-node for seamless SSR development with hot updates.
/**
* Vite-node plugin for SSR development
* Provides seamless SSR development with hot module replacement
* @param nuxt - Nuxt instance
* @returns Vite plugin instance
*/
function ViteNodePlugin(nuxt: Nuxt): Plugin;Vite-Node Features:
Common utilities used across multiple plugins for consistent behavior.
/**
* Check if file is a Vue component
* @param file - File path to check
* @returns Boolean indicating if file is Vue component
*/
function isVue(file: string): boolean;
/**
* Check if file is a CSS file
* @param file - File path to check
* @returns Boolean indicating if file is CSS
*/
function isCSS(file: string): boolean;
/**
* Convert value to array format
* @param value - Value to convert
* @returns Array containing the value(s)
*/
function toArray<T>(value: T | T[]): T[];Standard configuration patterns used across Nuxt Vite plugins.
/**
* Base plugin configuration interface
*/
interface BasePluginOptions {
/** Development mode flag */
dev?: boolean;
/** Source directory path */
srcDir?: string;
/** Build directory path */
buildDir?: string;
}Plugins are automatically registered by the build system with proper ordering.
Plugin Registration Order:
Plugins include comprehensive error handling and recovery mechanisms.
Error Handling Features:
Install with Tessl CLI
npx tessl i tessl/npm-nuxt--vite-builder