perf(setting-drawer): perf setting-drawer

This commit is contained in:
vben
2020-12-13 21:17:37 +08:00
parent 0362ab26b5
commit ed41e5082f
16 changed files with 804 additions and 566 deletions

32
build/vite/plugin/html.ts Normal file
View File

@@ -0,0 +1,32 @@
import type { Plugin } from 'vite';
import ViteHtmlPlugin from 'vite-plugin-html';
import { isProdFn, isSiteMode, ViteEnv } from '../../utils';
import { hmScript } from '../hm';
// @ts-ignore
import pkg from '../../../package.json';
import { GLOB_CONFIG_FILE_NAME } from '../../constant';
export function setupHtmlPlugin(plugins: Plugin[], env: ViteEnv) {
const { VITE_GLOB_APP_TITLE, VITE_PUBLIC_PATH } = env;
const htmlPlugin = ViteHtmlPlugin({
// html title
title: VITE_GLOB_APP_TITLE,
minify: isProdFn(),
options: {
// Package and insert additional configuration files
injectConfig: isProdFn()
? `<script src='${VITE_PUBLIC_PATH || './'}${GLOB_CONFIG_FILE_NAME}?v=${
pkg.version
}-${new Date().getTime()}'></script>`
: '',
// Insert Baidu statistics code
hmScript: isSiteMode() ? hmScript : '',
title: VITE_GLOB_APP_TITLE,
},
});
plugins.push(htmlPlugin);
return plugins;
}

View File

@@ -1,84 +1,32 @@
import type { Plugin as VitePlugin } from 'vite';
import type { Plugin as rollupPlugin } from 'rollup';
import { createMockServer } from 'vite-plugin-mock';
import { VitePWA } from 'vite-plugin-pwa';
import ViteHtmlPlugin from 'vite-plugin-html';
import PurgeIcons from 'vite-plugin-purge-icons';
import visualizer from 'rollup-plugin-visualizer';
import gzipPlugin from './gzip/index';
import { hmScript } from '../hm';
// @ts-ignore
import pkg from '../../../package.json';
import { isDevFn, isProdFn, isSiteMode, ViteEnv, isReportMode, isBuildGzip } from '../../utils';
import { GLOB_CONFIG_FILE_NAME } from '../../constant';
import { isProdFn, isSiteMode, ViteEnv, isReportMode, isBuildGzip } from '../../utils';
import { setupHtmlPlugin } from './html';
import { setupPwaPlugin } from './pwa';
import { setupMockPlugin } from './mock';
// gen vite plugins
export function createVitePlugins(viteEnv: ViteEnv) {
const { VITE_USE_MOCK, VITE_GLOB_APP_TITLE, VITE_PUBLIC_PATH, VITE_USE_PWA } = viteEnv;
const vitePlugins: VitePlugin[] = [];
// vite-plugin-html
vitePlugins.push(
ViteHtmlPlugin({
// html title
title: VITE_GLOB_APP_TITLE,
minify: isProdFn(),
options: {
// Package and insert additional configuration files
injectConfig: isProdFn()
? `<script src='${VITE_PUBLIC_PATH || './'}${GLOB_CONFIG_FILE_NAME}?v=${
pkg.version
}-${new Date().getTime()}'></script>`
: '',
// Insert Baidu statistics code
hmScript: isSiteMode() ? hmScript : '',
title: VITE_GLOB_APP_TITLE,
},
})
);
setupHtmlPlugin(vitePlugins, viteEnv);
// vite-plugin-pwa
setupPwaPlugin(vitePlugins, viteEnv);
// vite-plugin-mock
setupMockPlugin(vitePlugins, viteEnv);
// vite-plugin-purge-icons
vitePlugins.push(PurgeIcons());
if (isProdFn() && VITE_USE_PWA) {
vitePlugins.push(
VitePWA({
manifest: {
name: 'Vben Admin',
short_name: 'vben_admin',
icons: [
{
src: './resource/img/pwa-192x192.png',
sizes: '192x192',
type: 'image/png',
},
{
src: './resource/img/pwa-512x512.png',
sizes: '512x512',
type: 'image/png',
},
],
},
})
);
}
// vite-plugin-mock
if (isDevFn() && VITE_USE_MOCK) {
// open mock
vitePlugins.push(
createMockServer({
ignore: /^\_/,
mockPath: 'mock',
showTime: true,
})
);
}
return vitePlugins;
}
@@ -86,17 +34,15 @@ export function createVitePlugins(viteEnv: ViteEnv) {
export function createRollupPlugin() {
const rollupPlugins: rollupPlugin[] = [];
if (isProdFn()) {
if (isReportMode()) {
// rollup-plugin-visualizer
rollupPlugins.push(
visualizer({ filename: './build/.cache/stats.html', open: true }) as Plugin
);
}
if (isBuildGzip() || isSiteMode()) {
// rollup-plugin-gizp
rollupPlugins.push(gzipPlugin());
}
if (!isProdFn() && isReportMode()) {
// rollup-plugin-visualizer
rollupPlugins.push(visualizer({ filename: './build/.cache/stats.html', open: true }) as Plugin);
}
if (!isProdFn() && (isBuildGzip() || isSiteMode())) {
// rollup-plugin-gizp
rollupPlugins.push(gzipPlugin());
}
return rollupPlugins;
}

16
build/vite/plugin/mock.ts Normal file
View File

@@ -0,0 +1,16 @@
import { createMockServer } from 'vite-plugin-mock';
import type { Plugin } from 'vite';
import { isDevFn, ViteEnv } from '../../utils';
export function setupMockPlugin(plugins: Plugin[], env: ViteEnv) {
const { VITE_USE_MOCK } = env;
const mockPlugin = createMockServer({
ignore: /^\_/,
mockPath: 'mock',
showTime: true,
});
if (isDevFn() && VITE_USE_MOCK) {
plugins.push(mockPlugin);
}
return plugins;
}

31
build/vite/plugin/pwa.ts Normal file
View File

@@ -0,0 +1,31 @@
import { VitePWA } from 'vite-plugin-pwa';
import type { Plugin } from 'vite';
import { isProdFn, ViteEnv } from '../../utils';
export function setupPwaPlugin(plugins: Plugin[], env: ViteEnv) {
const { VITE_USE_PWA } = env;
const pwaPlugin = VitePWA({
manifest: {
name: 'Vben Admin',
short_name: 'vben_admin',
icons: [
{
src: './resource/img/pwa-192x192.png',
sizes: '192x192',
type: 'image/png',
},
{
src: './resource/img/pwa-512x512.png',
sizes: '512x512',
type: 'image/png',
},
],
},
});
if (isProdFn() && VITE_USE_PWA) {
plugins.push(pwaPlugin);
}
return plugins;
}