Introducing EnvVars: Instantly View Frontend Environment Variables in Chrome

December 28, 2025 · 3 min read

chrome-extension developer-tools react vue nextjs environment-variables debugging open-source frontend

Meet EnvVars: The Essential Developer Tool for Frontend Environment Variables

As modern web development grows more complex, environment variables have become a critical part of configuring and deploying frontend applications. But how do you know what variables are exposed in production, or quickly audit a site’s configuration? Enter EnvVars, a free Chrome Extension built by GTM Enterprises LLC to make this process effortless.

Why Choose EnvVars?

EnvVars stands out as a must-have tool for frontend developers, QA engineers, and security auditors. Whether you’re building with React, Vite, Next.js, Vue, Nuxt, Gatsby, Angular, or Svelte, EnvVars provides instant visibility into your app’s configuration. This helps you:

Ensure sensitive data is not exposed
Speed up debugging and troubleshooting
Validate deployment environments
Audit third-party sites for best practices

Public GitHub Repository

EnvVars is fully open source! Explore the code, contribute, or report issues on GitHub:

How EnvVars Works

EnvVars scans the current web page for environment variables exposed by popular frontend frameworks. It uses smart parsing to detect variables in bundled and minified code, then presents them in a clean, searchable interface. You can copy, export, or filter variables with ease.

Example Use Case

Suppose you’re reviewing a production deployment and want to verify that only safe variables are exposed. With EnvVars, simply click the extension icon and instantly see all environment variables, grouped by framework. You can then copy the list or export it as JSON for further analysis.

Key Features

Multi-Framework Detection: Works with all major frontend frameworks, including React, Vite, Next.js, Vue, Nuxt, Gatsby, Angular, Svelte, and custom setups.
Smart Parsing: Finds environment variables even in bundled or minified production code.
One-Click Access: Just click the EnvVars icon to scan the current page.
Search & Filter: Quickly find specific variables by name or framework.
Copy & Export: Copy all variables or export them as JSON for further analysis.
Zero Configuration: Works instantly—no setup, no configuration files.

Supported Frameworks & Patterns

React (REACT_APP_*)
Vite (VITE_*, import.meta.env)
Next.js (NEXT_PUBLIC_*, NEXT_DATA)
Vue (VUE_APP_*)
Nuxt (NUXT_PUBLIC_*, NUXT)
Gatsby (GATSBY_*)
Angular, Svelte, and custom configurations
Generic patterns: NODE_ENV, BASE_URL, PUBLIC_*

Use Cases

Debug API URLs and configuration in production
Verify correct environment deployment (dev/staging/prod)
Audit exposed variables for security review
Inspect third-party sites’ frontend configurations
Speed up development and troubleshooting workflows

Privacy First

EnvVars is designed with privacy in mind:

No data collection or tracking
All processing happens locally in your browser
No external server communication
100% open source—review the code yourself

Get Started

EnvVars is available for free on the Chrome Web Store. Simply add it to Chrome, click the icon, and instantly view environment variables on any site.

EnvVars Chrome Extension is maintained by GTM Enterprises LLC. For source code, documentation, and community support, visit the public GitHub repository: