Detectar producción frente a desarrollo React en tiempo de ejecución

¿Es posible detectar si la versión actual de React es de desarrollo o producción en tiempo de ejecución? Me gustaría hacer algo como esto:

if (React.isDevelopment) {
  // Development thing
} else {
  // Real thing
}

Esto se hace mejor emulando la forma de Node de hacer las cosas con su herramienta de compilación - webpack, browserify - exponiendo process.env.NODE_ENV. Normalmente, lo tendrá configurado en "producción" en prod y "desarrollo" (o indefinido) en dev.

Entonces tu código se convierte en:

if (!process.env.NODE_ENV || process.env.NODE_ENV === 'development') {
    // dev code
} else {
    // production code
}

Para saber cómo configurarlo, consulte envify o Pasando variables dependientes del entorno en webpack

Yo uso un archivo auxiliar (en TypeScript):

import process from "process";

const development: boolean = !process.env.NODE_ENV || process.env.NODE_ENV === 'development';

export default function isDev(): boolean
{
    return development;
}

Luego en otro lugar lo uso así:

import isDev from "./helpers/DevDetect";

if (isDev())
{
    ...
}

Quería acceder a esto desde index.html y deseaba una solución que no implicara expulsar el paquete web o configurarlo con módulos adicionales y se me ocurrió esto.

Las fuentes son la respuesta de David anterior y la documentación de create-react-app para usar variables de entorno en el archivo html

if ( ! '%NODE_ENV%' || '%NODE_ENV%' === 'development') {
  // dev code
} else {
  // production code    
}