Skip to content

On-demand Import

@meng-xi/vite-plugin supports three import granularities. Choose on demand to balance developer experience and bundle size.

Strategy Comparison

StrategyImport PathGranularityTree-shakingUse Case
Main Entry@meng-xi/vite-pluginCoarseDepends on bundlerQuick prototypes, multi-group usage
By Group@meng-xi/vite-plugin/plugins/{group}MediumGoodOnly using one category
Single Plugin@meng-xi/vite-plugin/plugins/{group}/{plugin}FineOptimalOnly using 1-2 plugins

Strategy 1: Main Entry Import

typescript
import { compressAssets, autoImport, buildProgress } from '@meng-xi/vite-plugin'

Pros: Concise syntax, no need to remember group paths. Cons: Bundler needs to analyze the entire entry; Tree-shaking depends on bundler capability.

TIP

Vite/Rollup have strong Tree-shaking capabilities, so main entry imports can usually remove unused code in production builds. However, for scenarios using only 1-2 plugins, finer-grained imports are still recommended.

typescript
// Only use compression plugins
import { compressAssets, imageOptimizer } from '@meng-xi/vite-plugin/plugins/compress'

// Only use generation plugins
import { autoImport, generateVersion } from '@meng-xi/vite-plugin/plugins/generate'

Pros: Clear semantics, good Tree-shaking — best choice for most scenarios.

Available Group Paths

GroupPathPlugins
compressplugins/compresscompressAssets, imageOptimizer
generateplugins/generateautoImport, generateUni, generatePages, generateRouter, generateVersion
injectplugins/injecthtmlInject, loadingManager, faviconManager, versionUpdateChecker
analyzeplugins/analyzebundleAnalyzer, buildProgress
copyplugins/copycopyFile, assetManifest
guardplugins/guardenvGuard
proxyplugins/proxyproxyManager

Strategy 3: Single Plugin Import

typescript
import { compressAssets } from '@meng-xi/vite-plugin/plugins/compress/compress-assets'
import type { CompressAssetsOptions } from '@meng-xi/vite-plugin/plugins/compress/compress-assets'

Pros: Finest granularity, smallest bundle size. Cons: Longer paths, verbose when using multiple plugins.

Framework and Utils Imports

The plugin framework and common utils also support sub-path imports:

typescript
// Plugin framework
import { BasePlugin, createPluginFactory } from '@meng-xi/vite-plugin/factory'
import type { BasePluginOptions } from '@meng-xi/vite-plugin/factory'

// Logger module
import { Logger } from '@meng-xi/vite-plugin/logger'

// Common utils (by module)
import { runWithConcurrency } from '@meng-xi/vite-plugin/common/concurrency'
import { formatFileSize } from '@meng-xi/vite-plugin/common/format'
import { scanDirectory } from '@meng-xi/vite-plugin/common/fs'

Type Imports

All plugin and util type definitions support sub-path imports:

typescript
import type {
  CompressAssetsOptions,
  CompressAlgorithm
} from '@meng-xi/vite-plugin/plugins/compress/compress-assets'

import type { BasePluginOptions } from '@meng-xi/vite-plugin/factory'
import type { LoggerOptions } from '@meng-xi/vite-plugin/logger'

Recommendation

ScenarioRecommended Strategy
Quick prototype / DemoMain Entry
Production (using 3+ groups)Main Entry
Production (using 1-2 groups)By Group
Library development (1 plugin)Single Plugin
Developing custom pluginsfactory + logger sub-paths

Next Steps

Released under the MIT License.