React 快速判断当前环境
在 React 应用中,经常需要区分开发环境和生产环境。以下是简洁的判断方法:
// 判断是否为开发环境
const isDev = process.env.NODE_ENV !== 'production';
// 使用示例
if (isDev) {
console.log('当前是开发环境');
}
封装 Hook 方便复用:
const useEnvironment = () => {
return {
isDev: process.env.NODE_ENV !== 'production',
isProd: process.env.NODE_ENV === 'production',
nodeEnv: process.env.NODE_ENV
};
};
// 组件中使用
const { isDev } = useEnvironment();
Vite 项目略有不同:
// Vite 使用 import.meta.env
const isDev = import.meta.env.DEV;
通过环境变量控制不同环境的 API 地址、日志输出等,避免手动修改配置。这是现代前端开发的通用实践。

浙公网安备 33010602011771号