Framework support

Dotvault for Create React App

Dotvault for Create React App projects.

Create React App uses the REACT_APP_ prefix for variables that get baked into the client bundle. Dotvault recognises it, labels those variables as client-exposed while you edit so the server-only ones stand apart, and gives you a visual editor with snapshot history for the whole thing.

What you get

  • →Detects CRA automatically from react-scripts in package.json.
  • →Labels REACT_APP_ variables as client-exposed, so the ones headed for the bundle are marked.
  • →Warns when a REACT_APP_ value can only be a secret, whatever git thinks of the file, because the bundle carries it either way.
  • →Flags values matching a known secret pattern in any file git can see.
  • →Snapshot and diff across .env, .env.development, .env.production.

Known environment variables

Dotvault recognises these variables when you open a Create React App project and surfaces helpful descriptions and warnings in the editor. Create React App is detected via react-scripts in package.json.

  • REACT_APP_

    Client-exposed variable (CRA)

  • BROWSER

    Browser to open on start

  • PORT

    Dev server port

  • HOST

    Dev server host

  • HTTPS

    Enable HTTPS in dev

  • CI

    Treat warnings as errors in CI

  • GENERATE_SOURCEMAP

    Generate source maps in production

  • INLINE_RUNTIME_CHUNK

    Inline the runtime chunk in index.html

  • IMAGE_INLINE_SIZE_LIMIT

    Image size threshold for inlining (bytes)

  • FAST_REFRESH

    Enable React Fast Refresh

  • TSC_COMPILE_ON_ERROR

    Build even with TypeScript errors

  • ESLINT_NO_DEV_ERRORS

    Downgrade ESLint errors to warnings in dev

  • DISABLE_ESLINT_PLUGIN

    Disable ESLint plugin entirely

Official Create React App docs: create-react-app.dev