Skip to content

Commit 98da067

Browse files
authored
feat: add archive plug-in to output dist.zip after build (vbenjs#4272)
* feat: add the archiver plug-in to output dist.zip after build * chore: update env
1 parent be3bcc1 commit 98da067

File tree

21 files changed

+200
-44
lines changed

21 files changed

+200
-44
lines changed

.lintstagedrc.mjs

+3-3
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,4 @@
11
export default {
2-
'{!(package)*.json,*.code-snippets,.!(browserslist)*rc}': [
3-
'prettier --cache --write--parser json',
4-
],
52
'*.{js,jsx,ts,tsx}': [
63
'prettier --cache --ignore-unknown --write',
74
'eslint --cache --fix',
@@ -16,5 +13,8 @@ export default {
1613
'eslint --cache --fix',
1714
'stylelint --fix --allow-empty-input',
1815
],
16+
'{!(package)*.json,*.code-snippets,.!(browserslist)*rc}': [
17+
'prettier --cache --write--parser json',
18+
],
1919
'package.json': ['prettier --cache --write'],
2020
};

apps/web-antd/.env.production

+3
Original file line numberDiff line numberDiff line change
@@ -14,3 +14,6 @@ VITE_ROUTER_HISTORY=hash
1414

1515
# 是否注入全局loading
1616
VITE_INJECT_APP_LOADING=true
17+
18+
# 打包后是否生成dist.zip
19+
VITE_ARCHIVER=true

apps/web-ele/.env.production

+3
Original file line numberDiff line numberDiff line change
@@ -14,3 +14,6 @@ VITE_ROUTER_HISTORY=hash
1414

1515
# 是否注入全局loading
1616
VITE_INJECT_APP_LOADING=true
17+
18+
# 打包后是否生成dist.zip
19+
VITE_ARCHIVER=true

apps/web-naive/.env.production

+3
Original file line numberDiff line numberDiff line change
@@ -14,3 +14,6 @@ VITE_ROUTER_HISTORY=hash
1414

1515
# 是否注入全局loading
1616
VITE_INJECT_APP_LOADING=true
17+
18+
# 打包后是否生成dist.zip
19+
VITE_ARCHIVER=true

docs/.vitepress/config/shared.mts

+3
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,8 @@ import type { HeadConfig } from 'vitepress';
33

44
import { resolve } from 'node:path';
55

6+
import { viteArchiverPlugin } from '@vben/vite-config';
7+
68
import {
79
GitChangelog,
810
GitChangelogMarkdownSection,
@@ -76,6 +78,7 @@ export const shared = defineConfig({
7678
repoURL: () => 'https://github.com/vbenjs/vue-vben-admin',
7779
}),
7880
GitChangelogMarkdownSection(),
81+
viteArchiverPlugin({ outputDir: '.vitepress' }),
7982
],
8083
server: {
8184
fs: {

docs/package.json

+1
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
"devDependencies": {
2121
"@nolebase/vitepress-plugin-git-changelog": "^2.4.0",
2222
"@types/markdown-it": "^14.1.2",
23+
"@vben/vite-config": "workspace:*",
2324
"@vite-pwa/vitepress": "^0.5.0",
2425
"vitepress": "^1.3.4",
2526
"vue": "^3.4.38"

docs/src/components/common-ui/vben-drawer.md

+20-16
Original file line numberDiff line numberDiff line change
@@ -58,22 +58,26 @@ const [Drawer, drawerApi] = useVbenDrawer({
5858

5959
所有属性都可以传入 `useVbenDrawer` 的第一个参数中。
6060

61-
| 属性名 | 描述 | 类型 | 默认值 |
62-
| ------------------ | ------------------- | --------------- | ------- |
63-
| title | 标题 | `string\|slot` | - |
64-
| titleTooltip | 标题提示信息 | `string\|slot` | - |
65-
| description | 描述信息 | `string\|slot` | - |
66-
| isOpen | 弹窗打开状态 | `boolean` | `false` |
67-
| loading | 弹窗加载状态 | `boolean` | `false` |
68-
| closable | 显示关闭按钮 | `boolean` | `true` |
69-
| modal | 显示遮罩 | `boolean` | `true` |
70-
| header | 显示header | `boolean` | `true` |
71-
| footer | 显示footer | `boolean\|slot` | `true` |
72-
| confirmLoading | 确认按钮loading状态 | `boolean` | `false` |
73-
| closeOnClickModal | 点击遮罩关闭弹窗 | `boolean` | `true` |
74-
| closeOnPressEscape | esc 关闭弹窗 | `boolean` | `true` |
75-
| confirmText | 确认按钮文本 | `boolean\|slot` | `确认` |
76-
| cancelText | 取消按钮文本 | `boolean\|slot` | `取消` |
61+
| 属性名 | 描述 | 类型 | 默认值 |
62+
| --- | --- | --- | --- |
63+
| title | 标题 | `string\|slot` | - |
64+
| titleTooltip | 标题提示信息 | `string\|slot` | - |
65+
| description | 描述信息 | `string\|slot` | - |
66+
| isOpen | 弹窗打开状态 | `boolean` | `false` |
67+
| loading | 弹窗加载状态 | `boolean` | `false` |
68+
| closable | 显示关闭按钮 | `boolean` | `true` |
69+
| modal | 显示遮罩 | `boolean` | `true` |
70+
| header | 显示header | `boolean` | `true` |
71+
| footer | 显示footer | `boolean\|slot` | `true` |
72+
| confirmLoading | 确认按钮loading状态 | `boolean` | `false` |
73+
| closeOnClickModal | 点击遮罩关闭弹窗 | `boolean` | `true` |
74+
| closeOnPressEscape | esc 关闭弹窗 | `boolean` | `true` |
75+
| confirmText | 确认按钮文本 | `string\|slot` | `确认` |
76+
| cancelText | 取消按钮文本 | `string\|slot` | `取消` |
77+
| class | modal的class,宽度通过这个配置 | `string` | - |
78+
| contentClass | modal内容区域的class | `string` | - |
79+
| footerClass | modal底部区域的class | `string` | - |
80+
| headerClass | modal顶部区域的class | `string` | - |
7781

7882
### Event
7983

docs/src/components/common-ui/vben-modal.md

+24-20
Original file line numberDiff line numberDiff line change
@@ -64,26 +64,30 @@ const [Modal, modalApi] = useVbenModal({
6464

6565
所有属性都可以传入 `useVbenModal` 的第一个参数中。
6666

67-
| 属性名 | 描述 | 类型 | 默认值 |
68-
| ------------------ | ------------------- | --------------- | ------- |
69-
| title | 标题 | `string\|slot` | - |
70-
| titleTooltip | 标题提示信息 | `string\|slot` | - |
71-
| description | 描述信息 | `string\|slot` | - |
72-
| isOpen | 弹窗打开状态 | `boolean` | `false` |
73-
| loading | 弹窗加载状态 | `boolean` | `false` |
74-
| fullscreen | 全屏显示 | `boolean` | `false` |
75-
| fullscreenButton | 显示全屏按钮 | `boolean` | `true` |
76-
| draggable | 可拖拽 | `boolean` | `false` |
77-
| closable | 显示关闭按钮 | `boolean` | `true` |
78-
| centered | 居中显示 | `boolean` | `false` |
79-
| modal | 显示遮罩 | `boolean` | `true` |
80-
| header | 显示header | `boolean` | `true` |
81-
| footer | 显示footer | `boolean\|slot` | `true` |
82-
| confirmLoading | 确认按钮loading状态 | `boolean` | `false` |
83-
| closeOnClickModal | 点击遮罩关闭弹窗 | `boolean` | `true` |
84-
| closeOnPressEscape | esc 关闭弹窗 | `boolean` | `true` |
85-
| confirmText | 确认按钮文本 | `boolean\|slot` | `确认` |
86-
| cancelText | 取消按钮文本 | `boolean\|slot` | `取消` |
67+
| 属性名 | 描述 | 类型 | 默认值 |
68+
| --- | --- | --- | --- |
69+
| title | 标题 | `string\|slot` | - |
70+
| titleTooltip | 标题提示信息 | `string\|slot` | - |
71+
| description | 描述信息 | `string\|slot` | - |
72+
| isOpen | 弹窗打开状态 | `boolean` | `false` |
73+
| loading | 弹窗加载状态 | `boolean` | `false` |
74+
| fullscreen | 全屏显示 | `boolean` | `false` |
75+
| fullscreenButton | 显示全屏按钮 | `boolean` | `true` |
76+
| draggable | 可拖拽 | `boolean` | `false` |
77+
| closable | 显示关闭按钮 | `boolean` | `true` |
78+
| centered | 居中显示 | `boolean` | `false` |
79+
| modal | 显示遮罩 | `boolean` | `true` |
80+
| header | 显示header | `boolean` | `true` |
81+
| footer | 显示footer | `boolean\|slot` | `true` |
82+
| confirmLoading | 确认按钮loading状态 | `boolean` | `false` |
83+
| closeOnClickModal | 点击遮罩关闭弹窗 | `boolean` | `true` |
84+
| closeOnPressEscape | esc 关闭弹窗 | `boolean` | `true` |
85+
| confirmText | 确认按钮文本 | `string\|slot` | `确认` |
86+
| cancelText | 取消按钮文本 | `string\|slot` | `取消` |
87+
| class | modal的class,宽度通过这个配置 | `string` | - |
88+
| contentClass | modal内容区域的class | `string` | - |
89+
| footerClass | modal底部区域的class | `string` | - |
90+
| headerClass | modal顶部区域的class | `string` | - |
8791

8892
### Event
8993

docs/src/en/guide/essentials/settings.md

+3
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,9 @@ VITE_DEVTOOLS=true
5555

5656
# Whether to inject global loading
5757
VITE_INJECT_APP_LOADING=true
58+
59+
# Whether to generate after packaging dist.zip
60+
VITE_ARCHIVER=true
5861
```
5962

6063
:::

docs/src/guide/essentials/settings.md

+5
Original file line numberDiff line numberDiff line change
@@ -55,6 +55,7 @@ VITE_DEVTOOLS=true
5555

5656
# 是否注入全局loading
5757
VITE_INJECT_APP_LOADING=true
58+
5859
```
5960

6061
```bash [.env.production]
@@ -75,6 +76,10 @@ VITE_ROUTER_HISTORY=hash
7576

7677
# 是否注入全局loading
7778
VITE_INJECT_APP_LOADING=true
79+
80+
# 打包后是否生成dist.zip
81+
VITE_ARCHIVER=true
82+
7883
```
7984

8085
:::

internal/lint-configs/eslint-config/src/configs/perfectionist.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -68,7 +68,7 @@ export async function perfectionist(): Promise<Linter.Config[]> {
6868
ignorePattern: ['children'],
6969
order: 'asc',
7070
partitionByComment: 'Part:**',
71-
type: 'alphabetical',
71+
type: 'natural',
7272
},
7373
],
7474
'perfectionist/sort-vue-attributes': [

internal/tailwind-config/src/index.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -190,8 +190,8 @@ export default {
190190
},
191191
float: {
192192
'0%': { transform: 'translateY(0)' },
193-
'100%': { transform: 'translateY(0)' },
194193
'50%': { transform: 'translateY(-20px)' },
194+
'100%': { transform: 'translateY(0)' },
195195
},
196196
},
197197
zIndex: {
@@ -228,11 +228,11 @@ function createColorsPalette(name: string) {
228228
// • backgroundDarkest (#172554): 适用于最深的背景,可能用于非常深色的区域或极端对比色。
229229

230230
return {
231+
50: `hsl(var(--${name}-50))`,
231232
100: `hsl(var(--${name}-100))`,
232233
200: `hsl(var(--${name}-200))`,
233234
300: `hsl(var(--${name}-300))`,
234235
400: `hsl(var(--${name}-400))`,
235-
50: `hsl(var(--${name}-50))`,
236236
500: `hsl(var(--${name}-500))`,
237237
600: `hsl(var(--${name}-600))`,
238238
700: `hsl(var(--${name}-700))`,

internal/vite-config/package.json

+2
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@
2929
"dependencies": {
3030
"@intlify/unplugin-vue-i18n": "^4.0.0",
3131
"@jspm/generator": "^2.1.3",
32+
"archiver": "^7.0.1",
3233
"cheerio": "1.0.0",
3334
"get-port": "^7.1.0",
3435
"html-minifier-terser": "^7.2.0",
@@ -39,6 +40,7 @@
3940
"vite-plugin-vue-devtools": "^7.3.9"
4041
},
4142
"devDependencies": {
43+
"@types/archiver": "^6.0.2",
4244
"@types/html-minifier-terser": "^7.0.2",
4345
"@vben/node-utils": "workspace:*",
4446
"@vitejs/plugin-vue": "^5.1.2",

internal/vite-config/src/config/application.ts

+2
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,8 @@ function defineApplicationConfig(userConfigPromise?: DefineApplicationOptions) {
2424
const env = loadEnv(mode, root);
2525

2626
const plugins = await loadApplicationPlugins({
27+
archiver: true,
28+
archiverPluginOptions: {},
2729
compress: false,
2830
compressTypes: ['brotli', 'gzip'],
2931
devtools: true,
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
import type { PluginOption } from 'vite';
2+
3+
import type { ArchiverPluginOptions } from '../typing';
4+
5+
import fs from 'node:fs';
6+
import { join } from 'node:path';
7+
8+
import archiver from 'archiver';
9+
10+
export const viteArchiverPlugin = (
11+
options: ArchiverPluginOptions = {},
12+
): PluginOption => {
13+
return {
14+
apply: 'build',
15+
closeBundle: {
16+
handler() {
17+
const { name = 'dist', outputDir = '.' } = options;
18+
19+
setTimeout(async () => {
20+
const folderToZip = 'dist';
21+
const zipOutputPath = join(process.cwd(), outputDir, `${name}.zip`);
22+
23+
try {
24+
await zipFolder(folderToZip, zipOutputPath);
25+
console.log(`Folder has been zipped to: ${zipOutputPath}`);
26+
} catch (error) {
27+
console.error('Error zipping folder:', error);
28+
}
29+
}, 0);
30+
},
31+
order: 'post',
32+
},
33+
enforce: 'post',
34+
name: 'vite:archiver',
35+
};
36+
};
37+
38+
async function zipFolder(
39+
folderPath: string,
40+
outputPath: string,
41+
): Promise<void> {
42+
return new Promise((resolve, reject) => {
43+
const output = fs.createWriteStream(outputPath);
44+
const archive = archiver('zip', {
45+
zlib: { level: 9 }, // 设置压缩级别为 9 以实现最高压缩率
46+
});
47+
48+
output.on('close', () => {
49+
console.log(
50+
`ZIP file created: ${outputPath} (${archive.pointer()} total bytes)`,
51+
);
52+
resolve();
53+
});
54+
55+
archive.on('error', (err) => {
56+
reject(err);
57+
});
58+
59+
archive.pipe(output);
60+
61+
// 使用 directory 方法以流的方式压缩文件夹,减少内存消耗
62+
archive.directory(folderPath, false);
63+
64+
// 流式处理完成
65+
archive.finalize();
66+
});
67+
}

internal/vite-config/src/plugins/index.ts

+11-1
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@ import { libInjectCss as viteLibInjectCss } from 'vite-plugin-lib-inject-css';
1818
import { VitePWA } from 'vite-plugin-pwa';
1919
import viteVueDevTools from 'vite-plugin-vue-devtools';
2020

21+
import { viteArchiverPlugin } from './archiver';
2122
import { viteExtraAppConfigPlugin } from './extra-app-config';
2223
import { viteImportMapPlugin } from './importmap';
2324
import { viteInjectAppLoadingPlugin } from './inject-app-loading';
@@ -92,6 +93,8 @@ async function loadApplicationPlugins(
9293
const env = options.env;
9394

9495
const {
96+
archiver,
97+
archiverPluginOptions,
9598
compress,
9699
compressTypes,
97100
extraAppConfig,
@@ -138,6 +141,7 @@ async function loadApplicationPlugins(
138141
return [await viteNitroMockPlugin(nitroMockOptions)];
139142
},
140143
},
144+
141145
{
142146
condition: injectAppLoading,
143147
plugins: async () => [await viteInjectAppLoadingPlugin(!!isBuild, env)],
@@ -184,7 +188,6 @@ async function loadApplicationPlugins(
184188
condition: !!html,
185189
plugins: () => [viteHtmlPlugin({ minify: true })],
186190
},
187-
188191
{
189192
condition: isBuild && importmap,
190193
plugins: () => {
@@ -197,6 +200,12 @@ async function loadApplicationPlugins(
197200
await viteExtraAppConfigPlugin({ isBuild: true, root: process.cwd() }),
198201
],
199202
},
203+
{
204+
condition: archiver,
205+
plugins: async () => {
206+
return [await viteArchiverPlugin(archiverPluginOptions)];
207+
},
208+
},
200209
]);
201210
}
202211

@@ -226,6 +235,7 @@ async function loadLibraryPlugins(
226235
export {
227236
loadApplicationPlugins,
228237
loadLibraryPlugins,
238+
viteArchiverPlugin,
229239
viteCompressPlugin,
230240
viteDtsPlugin,
231241
viteHtmlPlugin,

0 commit comments

Comments
 (0)