web_dist/bin/inject-env-to-window.js

const CONFIG_NAME = "__PRODUCTION____APP__CONF__";
const CONFIG_FILE_NAME = "_app.config.js";
const OUTPUT_DIR = "release/dist";

import path from "path";
import dotenv from "dotenv";
import fs from "fs";

/**
 * 获取用户根目录
 * @param dir file path
 */
function getRootPath(...dir) {
  return path.resolve(process.cwd(), ...dir);
}

/**
 * 获取以指定前缀开头的环境变量
 * @param match prefix
 * @param confFiles ext 为什么要测试和正式的都要循环有可能是测试加了东西但是正式没加，到时候上线会报错
 * 应该是防止环境变量缺失
 */
function getEnvConfig(
  match = "VITE_",
  confFiles = [".env.development", ".env.production"]
) {
  let envConfig = {};
  confFiles.forEach(item => {
    try {
      const env = dotenv.parse(
        fs.readFileSync(path.resolve(process.cwd(), item))
      );
      envConfig = { ...envConfig, ...env };
    } catch (e) {
      console.error(`解析错误:${item}`, e);
    }
  });
  const reg = new RegExp(`^(${match})`);
  Object.keys(envConfig).forEach(key => {
    if (!reg.test(key)) {
      Reflect.deleteProperty(envConfig, key);
    }
  });
  return envConfig;
}

function createConfig(params) {
  const { configName, config, configFileName } = params;
  try {
    const windowConf = `window.${configName}`;

    // 确保变量不会被修改
    const configStr = `${windowConf}=${JSON.stringify(config)};
      Object.freeze(${windowConf});
      Object.defineProperty(window, "${configName}", {
        configurable: false,
        writable: false,
      });
    `.replace(/\s/g, "");

    // 拼接新的输出根目录地址
    const filePath = `${OUTPUT_DIR}/`;

    // 创建根目录
    fs.mkdirSync(getRootPath(filePath), {
      recursive: true,
    });
    fs.writeFileSync(getRootPath(filePath + configFileName), configStr);

    console.log(`✨ 配置文件构建成功:`);
    console.log(filePath + "\n");
  } catch (error) {
    console.log("配置文件配置文件打包失败:\n" + error);
  }
}

const runBuild = async () => {
  try {
    const config = getEnvConfig();
    createConfig({
      config,
      configName: CONFIG_NAME,
      configFileName: CONFIG_FILE_NAME,
    });
    console.log(`环境变量注入成功 - 构建成功!`);
  } catch (error) {
    console.log("虚拟构建错误:\n" + error);
    process.exit(1);
  }
};

runBuild();