GTsoft/ruoyi-plus-soybean
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

build(projects): vite.config代码优化

Browse Source
This commit is contained in:
Soybean 2022-03-13 16:47:19 +08:00
parent d0522ce514
commit ca707a456b
13 changed files with 94 additions and 52 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
.env
View File

@ -6,4 +6,7 @@ VITE_APP_TITLE=Soybean管理系统
VITE_APP_DESC=SoybeanAdmin是一个中后台管理系统模版
VITE_SERVER_PORT=3200
VITE_HTTP_PROXY=true

6
README.md
View File

@ -87,6 +87,12 @@ pnpm dev
pnpm build
```
::: warning 注意
本地环境需要安装 pnpm 6.x 、Node.js 14.x 和 Git
:::
## 如何贡献
非常欢迎您的加入！[提一个 Issue](https://github.com/honghuangdc/soybean-admin/issues/new) 或者提交一个 Pull Request。

2
build/define/index.ts → build/config/define.ts
View File

@ -3,6 +3,6 @@ import dayjs from 'dayjs';
/** 项目构建时间 */
const PROJECT_BUILD_TIME = JSON.stringify(dayjs().format('YYYY-MM-DD HH:mm:ss'));
export const define = {
export const viteDefine = {
PROJECT_BUILD_TIME,
};

3
build/config/index.ts Normal file
View File

@ -0,0 +1,3 @@
export * from './path';
export * from './define';
export * from './proxy';

15
build/config/path.ts Normal file
View File

@ -0,0 +1,15 @@
import { fileURLToPath } from 'url';
/**
* 解析路径
* @param basePath - 基础路径
*/
export function resolvePath(rootPath: string, basePath: string) {
const root = fileURLToPath(new URL(rootPath, basePath));
const src = `${root}src`;
return {
root,
src,
};
}

23
build/config/proxy.ts Normal file
View File

@ -0,0 +1,23 @@
import type { ProxyOptions } from 'vite';
import { getEnvConfig } from '../../.env-config';
/**
* 设置网络代理
* @param viteEnv
*/
export function createViteProxy(viteEnv: ImportMetaEnv) {
const isOpenProxy = viteEnv.VITE_HTTP_PROXY === 'true';
if (!isOpenProxy) return undefined;
const { http } = getEnvConfig(viteEnv);
const proxy: Record<string, string | ProxyOptions> = {
[http.proxy]: {
target: http.url,
changeOrigin: true,
rewrite: (path) => path.replace(new RegExp(`^${http.proxy}`), ''),
},
};
return proxy;
}

2
build/index.ts
View File

@ -1,2 +1,2 @@
export * from './plugins';
export * from './define';
export * from './config';

2
build/plugins/html.ts
View File

@ -1,6 +1,6 @@
import { loadEnv } from 'vite';
import type { ConfigEnv, PluginOption } from 'vite';
import { createHtmlPlugin } from 'vite-plugin-html'; // html插件(使用变量、压缩)
import { createHtmlPlugin } from 'vite-plugin-html';
export default (config: ConfigEnv): PluginOption[] => {
const viteEnv = loadEnv(config.mode, `.env.${config.mode}`);

25
components.d.ts vendored
View File

@ -10,32 +10,7 @@ declare module 'vue' {
DarkModeSwitch: typeof import('./src/components/common/DarkModeSwitch.vue')['default'];
GithubLink: typeof import('./src/components/custom/GithubLink.vue')['default'];
HoverContainer: typeof import('./src/components/common/HoverContainer.vue')['default'];
IconAntDesignCloseOutlined: typeof import('~icons/ant-design/close-outlined')['default'];
IconAntDesignEnterOutlined: typeof import('~icons/ant-design/enter-outlined')['default'];
IconAntDesignSettingOutlined: typeof import('~icons/ant-design/setting-outlined')['default'];
IconCustomActivity: typeof import('~icons/custom/activity')['default'];
IconCustomAvatar: typeof import('~icons/custom/avatar')['default'];
IconCustomCast: typeof import('~icons/custom/cast')['default'];
IconCustomLogo: typeof import('~icons/custom/logo')['default'];
IconCustomLogoFill: typeof import('~icons/custom/logo-fill')['default'];
IconGridiconsFullscreen: typeof import('~icons/gridicons/fullscreen')['default'];
IconGridiconsFullscreenExit: typeof import('~icons/gridicons/fullscreen-exit')['default'];
IconIcOutlineCheck: typeof import('~icons/ic/outline-check')['default'];
IconLineMdMenuFoldLeft: typeof import('~icons/line-md/menu-fold-left')['default'];
IconLineMdMenuUnfoldLeft: typeof import('~icons/line-md/menu-unfold-left')['default'];
IconMdiArrowDownThin: typeof import('~icons/mdi/arrow-down-thin')['default'];
IconMdiArrowUpThin: typeof import('~icons/mdi/arrow-up-thin')['default'];
IconMdiClose: typeof import('~icons/mdi/close')['default'];
IconMdiGithub: typeof import('~icons/mdi/github')['default'];
IconMdiMoonWaningCrescent: typeof import('~icons/mdi/moon-waning-crescent')['default'];
IconMdiPin: typeof import('~icons/mdi/pin')['default'];
IconMdiPinOff: typeof import('~icons/mdi/pin-off')['default'];
IconMdiRefresh: typeof import('~icons/mdi/refresh')['default'];
IconMdiWhiteBalanceSunny: typeof import('~icons/mdi/white-balance-sunny')['default'];
IconPhCaretDoubleLeftBold: typeof import('~icons/ph/caret-double-left-bold')['default'];
IconPhCaretDoubleRightBold: typeof import('~icons/ph/caret-double-right-bold')['default'];
IconSelect: typeof import('./src/components/custom/IconSelect.vue')['default'];
IconUilSearch: typeof import('~icons/uil/search')['default'];
ImageVerify: typeof import('./src/components/custom/ImageVerify.vue')['default'];
LoadingEmptyWrapper: typeof import('./src/components/business/LoadingEmptyWrapper.vue')['default'];
LoginAgreement: typeof import('./src/components/business/LoginAgreement.vue')['default'];

1
package.json
View File

@ -90,6 +90,7 @@
"unplugin-vue-components": "^0.18.0",
"vite": "2.8.6",
"vite-plugin-html": "^3.1.0",
"vite-plugin-html-template": "^1.1.2",
"vite-plugin-mock": "^2.9.6",
"vite-plugin-windicss": "^1.8.3",
"vue-tsc": "^0.32.1",

30
pnpm-lock.yaml
View File

@ -59,6 +59,7 @@ specifiers:
vditor: ^3.8.12
vite: 2.8.6
vite-plugin-html: ^3.1.0
vite-plugin-html-template: ^1.1.2
vite-plugin-mock: ^2.9.6
vite-plugin-windicss: ^1.8.3
vue: ^3.2.31
@ -134,6 +135,7 @@ devDependencies:
unplugin-vue-components: 0.18.0_vite@2.8.6+vue@3.2.31
vite: 2.8.6_sass@1.49.9
vite-plugin-html: 3.1.0_vite@2.8.6
vite-plugin-html-template: 1.1.2
vite-plugin-mock: registry.npmmirror.com/vite-plugin-mock/2.9.6_mockjs@1.1.0+vite@2.8.6
vite-plugin-windicss: 1.8.3_vite@2.8.6
vue-tsc: 0.32.1_typescript@4.6.2
@ -2291,6 +2293,11 @@ packages:
side-channel: 1.0.4
dev: false
/interpret/1.4.0:
resolution: {integrity: sha512-agE4QfB2Lkp9uICn7BAqoscw4SZP9kTE2hxiFI3jBPmXJfdqiahTbUuKGsMoN2GtqL9AxhYioAcVvgsb1HvRbA==}
engines: {node: '>= 0.10'}
dev: true
/is-arguments/1.1.1:
resolution: {integrity: sha512-8Q7EARjzEnKpt/PCD7e1cgUS0a6X8u5tdSiMqXhojOdoV9TsMsiO+9VLC5vAmO8N7/GmXn7yjR8qnA6bVAEzfA==}
engines: {node: '>= 0.4'}
@ -3083,6 +3090,13 @@ packages:
picomatch: 2.3.0
dev: true
/rechoir/0.6.2:
resolution: {integrity: sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q=}
engines: {node: '>= 0.10'}
dependencies:
resolve: 1.22.0
dev: true
/regenerator-runtime/0.13.9:
resolution: {integrity: sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==}
dev: false
@ -3262,6 +3276,16 @@ packages:
engines: {node: '>=8'}
dev: true
/shelljs/0.8.4:
resolution: {integrity: sha512-7gk3UZ9kOfPLIAbslLzyWeGiEqx9e3rxwZM0KE6EL8GlGwjym9Mrlx5/p33bWTu9YG6vcS4MBxYZDHYr5lr8BQ==}
engines: {node: '>=4'}
hasBin: true
dependencies:
glob: 7.2.0
interpret: 1.4.0
rechoir: 0.6.2
dev: true
/side-channel/1.0.4:
resolution: {integrity: sha512-q5XPytqFEIKHkGdiMIrY10mvLRvnQh42/+GoBlFW3b2LXLE2xxJpZFdm94we0BaoV3RwJyGqg5wS7epxTv0Zvw==}
dependencies:
@ -3777,6 +3801,12 @@ packages:
resolution: {integrity: sha512-nguyw8L6Un8eelg1vQ31vIU2ESxqid7EYmy8V+MDeMaHBqaRSkg3dTBToC1PR00D89UzS/SLkfYPnx0Wf23IQQ==}
dev: false
/vite-plugin-html-template/1.1.2:
resolution: {integrity: sha512-R5pZ1VXph6K6HI7DZEJABn2Ex7DRYvPBNWtw2yr1KkY/BS6zYfzrqyf+W1Gukvjtg3Nx3evE06gVxud0jIx+yw==}
dependencies:
shelljs: 0.8.4
dev: true
/vite-plugin-html/3.1.0_vite@2.8.6:
resolution: {integrity: sha512-ig2XPSSeqG23/k7EQhIh0Pt1Fbm1V75G/qKnZDA3oIqKjIMaA1mF4Otmc2W2ru3AlBuuv5dFv+NQnO+i9QsK2w==}
peerDependencies:

2
src/typings/env.d.ts vendored
View File

@ -19,6 +19,8 @@ interface ImportMetaEnv {
readonly VITE_APP_TITLE: string;
/** 项目描述 */
readonly VITE_APP_DESC: string;
/** 开发启动的服务端口号 */
readonly VITE_SERVER_PORT: string;
/** vite环境类型 */
readonly VITE_ENV_TYPE?: EnvType;
/** 开启请求代理 */

32
vite.config.ts
View File

@ -1,26 +1,20 @@
import { fileURLToPath } from 'url';
import { defineConfig, loadEnv } from 'vite';
import { setupVitePlugins, define } from './build';
import { getEnvConfig } from './.env-config';
import { resolvePath, viteDefine, setupVitePlugins, createViteProxy } from './build';
export default defineConfig((configEnv) => {
const viteEnv = loadEnv(configEnv.mode, `.env.${configEnv.mode}`) as ImportMetaEnv;
const srcPath = fileURLToPath(new URL('./src', import.meta.url));
const rootPath = fileURLToPath(new URL('./', import.meta.url));
const { http } = getEnvConfig(viteEnv);
const vitePath = resolvePath('./', import.meta.url);
return {
base: viteEnv.VITE_BASE_URL,
resolve: {
alias: {
'@': srcPath,
'~/': rootPath,
'~/': vitePath.root,
'@': vitePath.src,
},
},
define,
plugins: setupVitePlugins(configEnv, srcPath, viteEnv),
define: viteDefine,
plugins: setupVitePlugins(configEnv, vitePath.src, viteEnv),
css: {
preprocessorOptions: {
scss: {
@ -29,23 +23,13 @@ export default defineConfig((configEnv) => {
},
},
server: {
fs: {
strict: false,
},
host: '0.0.0.0',
port: 3200,
port: Number(viteEnv.VITE_SERVER_PORT),
open: true,
proxy: {
[http.proxy]: {
target: http.url,
changeOrigin: true,
rewrite: (path) => path.replace(new RegExp(`^${http.proxy}`), ''),
},
},
proxy: createViteProxy(viteEnv),
},
build: {
brotliSize: false,
sourcemap: false,
},
};
});