从CRA迁移至Vite后出现「Unable to determine current node version」错误求助

这个错误的核心原因是**@fortawesome/fontawesome-svg-core的babel宏在浏览器环境中无法读取到Node版本信息**，而你的Vite配置直接将process.env设为空对象，彻底切断了宏获取该变量的路径。以下是适配你当前配置的修复步骤：

步骤1：修正Vite的环境变量定义 #

打开vite.config.js，将原来空对象的process.env定义替换为仅注入NODE_VERSION变量：

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react";

export default defineConfig(() => {
  return {
    define: {
      // 注入Node版本，供fontawesome宏使用
      "process.env.NODE_VERSION": JSON.stringify(process.version),
    },
    build: {
      outDir: "build",
    },
    plugins: [react()],
  };
});

不要直接将process.env设为空对象，这会导致所有依赖process.env的第三方包失效。按需注入必要变量是更安全的做法。

步骤2：验证Babel宏配置（可选） #

你的babel.config.json和babel-plugin-macros.config.js配置是正确的，但如果上述修改后仍有问题，可以确保@vitejs/plugin-react正确处理Babel插件：

// vite.config.js中调整react插件配置
plugins: [
  react({
    babel: {
      plugins: ["macros"],
    },
  }),
],

这一步是冗余的（因为你已经有独立的babel配置文件），但可以作为兜底方案。

步骤3：升级FontAwesome版本（可选） #

你当前使用的@fortawesome/fontawesome-svg-core是6.2.0版本，该版本的宏对Vite环境的兼容性不如新版本。如果上述步骤无效，建议升级到最新免费版：

npm update @fortawesome/fontawesome-svg-core @fortawesome/free-regular-svg-icons @fortawesome/free-solid-svg-icons @fortawesome/react-fontawesome

完成上述修改后，重启Vite服务，浏览器控制台的错误应该会消失。

内容的提问来源于stack exchange，提问作者devnull69