67 lines
1.6 KiB
TypeScript
67 lines
1.6 KiB
TypeScript
// @ts-ignore
|
|
import { dependencies } from './package.json';
|
|
import { defineConfig } from 'vite';
|
|
import react from '@vitejs/plugin-react';
|
|
import { visualizer } from 'rollup-plugin-visualizer';
|
|
import topLevelAwait from 'vite-plugin-top-level-await';
|
|
|
|
// dependencies that exist anywhere
|
|
const vendor = [
|
|
'react', 'react-dom', 'react-router', 'react-router-dom',
|
|
'@fluentui/react-icons',
|
|
'mobx', 'mobx-react-lite',
|
|
'i18next', 'react-i18next',
|
|
'usehooks-ts', 'react-toastify',
|
|
'classnames', 'lodash-es'
|
|
];
|
|
|
|
const embedded = [
|
|
// split @fluentui/react-components by components
|
|
'@fluentui/react-components',
|
|
|
|
// dependencies that exist in single component
|
|
'react-beautiful-dnd',
|
|
'react-draggable',
|
|
'@magenta/music', 'html-midi-player',
|
|
'react-markdown', 'rehype-highlight', 'rehype-raw', 'remark-breaks', 'remark-gfm'
|
|
];
|
|
|
|
function renderChunks(deps: Record<string, string>) {
|
|
let chunks = {};
|
|
Object.keys(deps).forEach((key) => {
|
|
if ([...vendor, ...embedded].includes(key)) return;
|
|
chunks[key] = [key];
|
|
});
|
|
return chunks;
|
|
}
|
|
|
|
// https://vitejs.dev/config/
|
|
export default defineConfig({
|
|
plugins: [
|
|
react(),
|
|
visualizer({
|
|
template: 'treemap',
|
|
gzipSize: true,
|
|
brotliSize: true
|
|
}),
|
|
topLevelAwait({
|
|
promiseExportName: '__tla',
|
|
promiseImportName: i => `__tla_${i}`
|
|
})
|
|
],
|
|
build: {
|
|
chunkSizeWarningLimit: 3000,
|
|
rollupOptions: {
|
|
output: {
|
|
manualChunks: {
|
|
vendor,
|
|
...renderChunks(dependencies)
|
|
},
|
|
entryFileNames: `assets/[name].js`,
|
|
chunkFileNames: `assets/[name].js`,
|
|
assetFileNames: `assets/[name].[ext]`
|
|
}
|
|
}
|
|
}
|
|
});
|