vue通过mode参数动态执行vite环境变量方式

/**
 * 动态环境参数脚本，用于设置环境变量并执行 vite 命令。
 * 用法: node scripts/setup.js dev -- PA
 *      node scripts/setup.js build -- PB
 * 构建：pnpm dev:exp -- PA     pnpm build:exp -- PA
 */
const { spawn } = require('child_process');
const path = require('path');

// 获取命令行参数
const args = process.argv.slice(2);
const command = args[0]; // dev 或 build
const envFlag = args[1]; // PA 或 PB 等

// 验证参数
if (!command) {
  console.error('错误: 请指定命令 (dev 或 build)');
  process.exit(1);
}

// 提取环境模式 (去掉前缀 --)
let mode = envFlag || 'dev'; //envFlag.slice(2);
// 根据命令构建 vite 命令
const viteCommand = 'vite';
let viteArgs;

// 设置环境变量
process.env.VITE_APP_MODE = mode;
if (command === 'dev') {
  viteArgs = ['--mode', mode];
} else if (command === 'build') {
  viteArgs = ['build', '--mode', mode];
} else {
  console.error(`错误: 不支持的命令 "${command}"`);
  process.exit(1);
}

console.log(`运行环境: ${mode}`);
console.log(`执行命令: ${viteCommand} ${viteArgs.join(' ')}`);

// 执行 vite 命令
const child = spawn(viteCommand, viteArgs, {
  stdio: 'inherit',
  shell: true,
  cwd: path.resolve(__dirname, '..'),
});

child.on('exit', code => {
  process.exit(code);
});

import { fileURLToPath, URL } from 'node:url';
import { defineConfig, loadEnv } from 'vite';
import vue from '@vitejs/plugin-vue';

export default defineConfig(({ mode }) => {
  const env = loadEnv(mode, process.cwd());
  return {
    // 将环境变量注入到客户端代码
    define: {
      'process.env': JSON.stringify({
        NODE_ENV: process.env.NODE_ENV,
        ...env,
      }),
    },
    plugins: [vue()],
    resolve: {
      alias: {
        '@': fileURLToPath(new URL('./src', import.meta.url)),
      },
    },
  };
});

{
  "scripts": {
    "dev": "vite", 
    "dev:exp": "node scripts/setup.js dev",
    "build:exp": "node scripts/setup.js build",
  }
}

# 启动开发服务 并指定项目参数
pnpm dev:exp -- pA

# 打包代码，并指定项目参数
pnpm build:exp -- PA

# 启动默认服务 不指定项目参数
pnpm dev

<template>
  <div>  
  </div>
</template>
<script lang="ts" setup>
const projectMode = process.env.VITE_APP_MODE; // 获取当前运行模式
console.log('projectMode', projectMode);
</script>