feat: support some configurations through the .env file

pull/48/MERGE
vince 2024-07-09 23:43:08 +08:00
parent 2731a1ec96
commit 2406ca832b
10 changed files with 50 additions and 19 deletions

View File

@ -4,3 +4,5 @@ VITE_PUBLIC_PATH = /
# Basic interface address SPA # Basic interface address SPA
VITE_GLOB_API_URL=/api VITE_GLOB_API_URL=/api
VITE_VISUALIZER = true

View File

@ -2,4 +2,8 @@
VITE_PUBLIC_PATH = / VITE_PUBLIC_PATH = /
# Basic interface address SPA # Basic interface address SPA
VITE_GLOB_API_URL=https://mock-napi.vben.pro/api VITE_GLOB_API_URL = https://mock-napi.vben.pro/api
VITE_COMPRESS = gzip
VITE_PWA = false

View File

@ -17,6 +17,7 @@
"type": "module", "type": "module",
"scripts": { "scripts": {
"build": "pnpm vite build", "build": "pnpm vite build",
"build:analyze": "pnpm vite build --mode analyze",
"dev": "pnpm vite", "dev": "pnpm vite",
"preview": "vite preview", "preview": "vite preview",
"typecheck": "vue-tsc --noEmit --skipLibCheck" "typecheck": "vue-tsc --noEmit --skipLibCheck"

View File

@ -1,10 +1,11 @@
import { defineConfig } from '@vben/vite-config'; import { defineConfig, loadAndConvertEnv } from '@vben/vite-config';
export default defineConfig({ export default defineConfig({
application: ({ mode }) => { application: async ({ mode }) => {
const envConfig = await loadAndConvertEnv();
return { return {
compress: false, ...envConfig,
compressTypes: ['brotli', 'gzip'] as const,
importmap: false, importmap: false,
importmapOptions: { importmapOptions: {
// 通过 Importmap CDN 方式引入, // 通过 Importmap CDN 方式引入,
@ -40,7 +41,6 @@ export default defineConfig({
short_name: `Vben Admin Pro ${mode}`, short_name: `Vben Admin Pro ${mode}`,
}, },
}, },
visualizer: false,
}; };
}, },
vite: { vite: {

View File

@ -31,7 +31,7 @@ function defineApplicationConfig(options: DefineApplicationOptions = {}) {
pwa: true, pwa: true,
turboConsole: false, turboConsole: false,
...(typeof application === 'function' ...(typeof application === 'function'
? application(config) ? await application(config)
: application), : application),
}); });
@ -71,7 +71,7 @@ function defineApplicationConfig(options: DefineApplicationOptions = {}) {
); );
return mergeConfig( return mergeConfig(
mergedConfig, mergedConfig,
typeof vite === 'function' ? vite(config) : vite, typeof vite === 'function' ? await vite(config) : vite,
); );
}); });
} }

View File

@ -22,7 +22,7 @@ function defineLibraryConfig(options: DefineLibraryOptions = {}) {
injectMetadata: true, injectMetadata: true,
isBuild, isBuild,
mode, mode,
...(typeof library === 'function' ? library(config) : library), ...(typeof library === 'function' ? await library(config) : library),
}); });
const { dependencies = {}, peerDependencies = {} } = const { dependencies = {}, peerDependencies = {} } =
@ -54,7 +54,7 @@ function defineLibraryConfig(options: DefineLibraryOptions = {}) {
const mergedConfig = mergeConfig(commonConfig, packageConfig); const mergedConfig = mergeConfig(commonConfig, packageConfig);
return mergeConfig( return mergeConfig(
mergedConfig, mergedConfig,
typeof vite === 'function' ? vite(config) : vite, typeof vite === 'function' ? await vite(config) : vite,
); );
}); });
} }

View File

@ -1,2 +1,3 @@
export * from './config'; export * from './config';
export * from './plugins'; export * from './plugins';
export { loadAndConvertEnv } from './utils/env';

View File

@ -6,7 +6,7 @@ import {
readPackageJSON, readPackageJSON,
} from '@vben/node-utils'; } from '@vben/node-utils';
import { getEnvConfig } from '../utils/env'; import { loadEnv } from '../utils/env';
interface PluginOptions { interface PluginOptions {
isBuild: boolean; isBuild: boolean;
@ -73,7 +73,7 @@ async function viteExtraAppConfigPlugin({
} }
async function getConfigSource() { async function getConfigSource() {
const config = await getEnvConfig(); const config = await loadEnv();
const windowVariable = `window.${VBEN_ADMIN_PRO_APP_CONF}`; const windowVariable = `window.${VBEN_ADMIN_PRO_APP_CONF}`;
// 确保变量不会被修改 // 确保变量不会被修改
let source = `${windowVariable}=${JSON.stringify(config)};`; let source = `${windowVariable}=${JSON.stringify(config)};`;

View File

@ -42,7 +42,7 @@ interface CommonPluginOptions {
devtools?: boolean; devtools?: boolean;
/** 环境变量 */ /** 环境变量 */
env?: Record<string, any>; env?: Record<string, any>;
/** 是否开启注入metadata */ /** 是否注入metadata */
injectMetadata?: boolean; injectMetadata?: boolean;
/** 是否构建模式 */ /** 是否构建模式 */
isBuild?: boolean; isBuild?: boolean;
@ -93,14 +93,14 @@ interface LibraryOptions extends LibraryPluginOptions {}
interface DefineApplicationOptions { interface DefineApplicationOptions {
application?: application?:
| ((config: ConfigEnv) => ApplicationOptions) | ((config: ConfigEnv) => Promise<ApplicationOptions>)
| ApplicationOptions; | ApplicationOptions;
vite?: ((config: ConfigEnv) => UserConfig) | UserConfig; vite?: ((config: ConfigEnv) => Promise<UserConfig>) | UserConfig;
} }
interface DefineLibraryOptions { interface DefineLibraryOptions {
library?: ((config: ConfigEnv) => LibraryOptions) | LibraryOptions; library?: ((config: ConfigEnv) => Promise<LibraryOptions>) | LibraryOptions;
vite?: ((config: ConfigEnv) => UserConfig) | UserConfig; vite?: ((config: ConfigEnv) => Promise<UserConfig>) | UserConfig;
} }
type DefineConfig = { type DefineConfig = {

View File

@ -1,3 +1,5 @@
import type { ApplicationPluginOptions } from '../typing';
import { join } from 'node:path'; import { join } from 'node:path';
import { fs } from '@vben/node-utils'; import { fs } from '@vben/node-utils';
@ -23,7 +25,7 @@ function getConfFiles() {
* @param match prefix * @param match prefix
* @param confFiles ext * @param confFiles ext
*/ */
export async function getEnvConfig( async function loadEnv<T = Record<string, string>>(
match = 'VITE_GLOB_', match = 'VITE_GLOB_',
confFiles = getConfFiles(), confFiles = getConfFiles(),
) { ) {
@ -46,5 +48,26 @@ export async function getEnvConfig(
Reflect.deleteProperty(envConfig, key); Reflect.deleteProperty(envConfig, key);
} }
}); });
return envConfig; return envConfig as T;
} }
async function loadAndConvertEnv(
match = 'VITE_',
confFiles = getConfFiles(),
): Promise<Partial<ApplicationPluginOptions>> {
const envConfig = await loadEnv(match, confFiles);
const visualizer = envConfig.visualizer || '';
const pwa = envConfig.pwa || '';
const compress = envConfig.VITE_COMPRESS || '';
const compressTypes = compress
.split(',')
.filter((item) => ['brotli', 'gzip'].includes(item));
return {
compress: !!compress,
compressTypes: compressTypes as ('brotli' | 'gzip')[],
pwa: !!pwa,
visualizer: !!visualizer,
};
}
export { loadAndConvertEnv, loadEnv };