Commit 4cca00717692ab8b68a1c7dd985a2821a28ec5db

Authored by vben
1 parent 81e90409

test(code-split): code split optimization

CHANGELOG.zh_CN.md
@@ -10,6 +10,7 @@ @@ -10,6 +10,7 @@
10 - 还原 antdv 默认 loading,重构 `Loading` 组件,增加`useLoading`和`v-loading`指令。并增加示例 10 - 还原 antdv 默认 loading,重构 `Loading` 组件,增加`useLoading`和`v-loading`指令。并增加示例
11 - i18n 支持 vscode `i18n-ally`插件 11 - i18n 支持 vscode `i18n-ally`插件
12 - 新增多级路由缓存示例 12 - 新增多级路由缓存示例
  13 +- 打包代码拆分(试验)
13 14
14 ### ⚡ Performance Improvements 15 ### ⚡ Performance Improvements
15 16
build/vite/optimizer.ts 0 → 100644
  1 +import type { GetManualChunk, GetManualChunkApi } from 'rollup';
  2 +
  3 +//
  4 +const vendorLibs: { match: string[]; output: string }[] = [
  5 + {
  6 + match: ['xlsx'],
  7 + output: 'xlsx',
  8 + },
  9 +];
  10 +
  11 +// @ts-ignore
  12 +export const configManualChunk: GetManualChunk = (id: string, api: GetManualChunkApi) => {
  13 + if (/[\\/]node_modules[\\/]/.test(id)) {
  14 + const matchItem = vendorLibs.find((item) => {
  15 + const reg = new RegExp(`[\\/]node_modules[\\/]_?(${item.match.join('|')})(.*)`, 'ig');
  16 + return reg.test(id);
  17 + });
  18 + return matchItem ? matchItem.output : null;
  19 + }
  20 +};
vite.config.ts
@@ -3,6 +3,7 @@ import { resolve } from 'path'; @@ -3,6 +3,7 @@ import { resolve } from 'path';
3 3
4 import { modifyVars } from './build/config/lessModifyVars'; 4 import { modifyVars } from './build/config/lessModifyVars';
5 import { createProxy } from './build/vite/proxy'; 5 import { createProxy } from './build/vite/proxy';
  6 +import { configManualChunk } from './build/vite/optimizer';
6 7
7 import globbyTransform from './build/vite/plugin/transform/globby'; 8 import globbyTransform from './build/vite/plugin/transform/globby';
8 import dynamicImportTransform from './build/vite/plugin/transform/dynamic-import'; 9 import dynamicImportTransform from './build/vite/plugin/transform/dynamic-import';
@@ -53,9 +54,11 @@ const viteConfig: UserConfig = { @@ -53,9 +54,11 @@ const viteConfig: UserConfig = {
53 // terser options 54 // terser options
54 terserOptions: { 55 terserOptions: {
55 compress: { 56 compress: {
  57 + keep_infinity: true,
56 drop_console: VITE_DROP_CONSOLE, 58 drop_console: VITE_DROP_CONSOLE,
57 }, 59 },
58 }, 60 },
  61 +
59 define: { 62 define: {
60 __VERSION__: pkg.version, 63 __VERSION__: pkg.version,
61 // setting vue-i18-next 64 // setting vue-i18-next
@@ -64,12 +67,14 @@ const viteConfig: UserConfig = { @@ -64,12 +67,14 @@ const viteConfig: UserConfig = {
64 __VUE_I18N_FULL_INSTALL__: false, 67 __VUE_I18N_FULL_INSTALL__: false,
65 __INTLIFY_PROD_DEVTOOLS__: false, 68 __INTLIFY_PROD_DEVTOOLS__: false,
66 }, 69 },
  70 +
67 cssPreprocessOptions: { 71 cssPreprocessOptions: {
68 less: { 72 less: {
69 modifyVars: modifyVars, 73 modifyVars: modifyVars,
70 javascriptEnabled: true, 74 javascriptEnabled: true,
71 }, 75 },
72 }, 76 },
  77 +
73 // The package will be recompiled using rollup, and the new package compiled into the esm module specification will be put into node_modules/.vite_opt_cache 78 // The package will be recompiled using rollup, and the new package compiled into the esm module specification will be put into node_modules/.vite_opt_cache
74 optimizeDeps: { 79 optimizeDeps: {
75 include: [ 80 include: [
@@ -80,11 +85,6 @@ const viteConfig: UserConfig = { @@ -80,11 +85,6 @@ const viteConfig: UserConfig = {
80 ], 85 ],
81 }, 86 },
82 87
83 - proxy: createProxy(VITE_PROXY),  
84 - plugins: createVitePlugins(viteEnv),  
85 - rollupInputOptions: {  
86 - plugins: createRollupPlugin(),  
87 - },  
88 transforms: [ 88 transforms: [
89 globbyTransform({ 89 globbyTransform({
90 resolvers: resolvers, 90 resolvers: resolvers,
@@ -94,6 +94,19 @@ const viteConfig: UserConfig = { @@ -94,6 +94,19 @@ const viteConfig: UserConfig = {
94 }), 94 }),
95 dynamicImportTransform(VITE_DYNAMIC_IMPORT), 95 dynamicImportTransform(VITE_DYNAMIC_IMPORT),
96 ], 96 ],
  97 +
  98 + proxy: createProxy(VITE_PROXY),
  99 +
  100 + plugins: createVitePlugins(viteEnv),
  101 +
  102 + rollupInputOptions: {
  103 + plugins: createRollupPlugin(),
  104 + },
  105 +
  106 + rollupOutputOptions: {
  107 + compact: true,
  108 + manualChunks: configManualChunk,
  109 + },
97 }; 110 };
98 111
99 export default viteConfig; 112 export default viteConfig;