vite-plugin-barrel

> A vite port version of next.js optimizePackagesImports

 

why

Some packages exports lots of modules, it will cause vite transform lots of files in build step. For example, @mui/icons-material exports 1000+ components, it's harmful for vite build performance.

!benchmark

Test on Apple M1 Pro, with this plugin, it improve 50%+ build performance.

> [!NOTE]
> According to swc_compat_range_docs, you should select right @swc/core version.
> - vite-plugin-barrel@0.2.x ~ 0.3.x and swc-plugin-barrel@0.1.x ~ 0.2.x use swc_core@0.96.x compat with 1.6.x
> - vite-plugin-barrel@0.4.x and swc-plugin-barrel@0.3.x use swc_core@0.105.0 compat with v1.7.0-v1.7.27

install

``console
pnpm add vite-plugin-barrel
`

usage

`ts
// vite.config.ts
import react from '@vitejs/plugin-react'
import { defineConfig } from 'vite'
import { barrel } from 'vite-plugin-barrel'

// https://vitejs.dev/config/
export default defineConfig({
plugins: [
react(),
barrel({ packages: ['@mui/material', '@mui/icons-material'] }),
],
})
`

options

$3

- Type: string[]

The packages you want to optimize.

$3

- Type: plugin-react-swc
- Optional

vite-plugin-barrel will use @swc/core to transform code with swc-plugin-barrel. You can pass this plugin directly to @vitejs/plugin-react-swc disable extra transform to improve performance.

`ts
// vite.config.ts
import react from '@vitejs/plugin-react-swc'
import { defineConfig } from 'vite'
import { barrel, swc_plugin_barrel } from 'vite-plugin-barrel'

// https://vitejs.dev/config/
export default defineConfig({
plugins: [
react({
plugins: [
swc_plugin_barrel({
packages: ['@mui/material', '@mui/icons-material']
})
]
}),
barrel({
packages: ['@mui/material', '@mui/icons-material'],
experimental: {
intergration: 'plugin-react-swc'
}
}),
],
})
``

credits

next.js optimize_barrel

#