split-vendor-chunk-plugin

7.0.0 verified Mon Apr 27 auth: no javascript

A Vite plugin that automatically splits vendor chunks (node_modules imports) into separate files for improved caching and parallel loading. Current stable version: 7.0.0. The plugin groups node_modules imports into vendor chunks based on package name, with scoped packages handled separately. It is a lightweight alternative to manual Rollup/Vite manualChunks configuration. Release cadence is irregular but maintained.

Common errors

error TypeError: splitVendorChunkPlugin is not a function ↓

cause Using require instead of import (CJS) or forgetting to call the plugin function (e.g., passing reference directly).

fix

Use ESM import: import splitVendorChunkPlugin from 'split-vendor-chunk-plugin' and call it: plugins: [splitVendorChunkPlugin()]

error The plugin 'vite:split-vendor-chunk' has already been added ↓

cause Adding the plugin multiple times in the plugins array.

fix

Include splitVendorChunkPlugin() only once.

error Error: ENOENT: no such file or directory, open '.../dist/assets/vendor-xxxxx.js.map' ↓

cause Source map issue when chunk name contains characters like '@' or parentheses from scoped packages.

fix

Disable source maps or configure clean chunk names: e.g., replace '@' with '_' in manualChunks.

Warnings

gotcha The plugin does not respect Vite's `build.rollupOptions.output.manualChunks` – it applies its own chunk splitting which may conflict with user-defined manualChunks. ↓

fix Avoid setting manualChunks when using this plugin, or customize manually via manualChunks instead of using this plugin.

gotcha Scoped packages produce chunk names with '@' in filename, which may cause issues on some file systems or deployment servers (e.g., IIS). ↓

fix Use a custom chunk name function or replace '@' in filenames if deployment fails.

deprecated Deprecated: This plugin is effectively a wrapper around Vite's built-in `build.rollupOptions.output.manualChunks`. Since Vite 4+, consider using manualChunks directly for better control. ↓

fix Replace with Vite's manualChunks: `build: { rollupOptions: { output: { manualChunks(id) { if (id.includes('node_modules')) return 'vendor' } } } }`

Install

npm install split-vendor-chunk-plugin

yarn add split-vendor-chunk-plugin

pnpm add split-vendor-chunk-plugin

Imports

splitVendorChunkPlugin

wrong

const splitVendorChunkPlugin = require('split-vendor-chunk-plugin')

correct

import splitVendorChunkPlugin from 'split-vendor-chunk-plugin'

Default import is correct; ESM-only, no CommonJS export.

splitVendorChunkPlugin
wrong
```
plugins: [splitVendorChunkPlugin]
```
correct
```
plugins: [splitVendorChunkPlugin()]
```
Call the function to return a plugin instance; do not pass the function reference directly.

splitVendorChunkPlugin

wrong

import splitVendorChunkPlugin from 'split-vendor-chunk-plugin'

correct

import { splitVendorChunkPlugin } from 'split-vendor-chunk-plugin'

Only default export exists (v1-v7). Named export is a common mistake.

Quickstart

Basic Vite configuration using split-vendor-chunk-plugin to automatically split vendor chunks.

// vite.config.js
import { defineConfig } from 'vite'
import splitVendorChunkPlugin from 'split-vendor-chunk-plugin'

export default defineConfig({
  plugins: [
    splitVendorChunkPlugin()
  ]
})