Properly configuring environments helps you organize issues, filter noise, and apply environment-specific settings.
Setting the Environment
The environment option identifies where your code is running:
import * as Sentry from '@sentry/browser' ;
Sentry . init ({
dsn: '__DSN__' ,
environment: 'production' ,
});
Using Environment Variables
Sentry . init ({
dsn: '__DSN__' ,
environment: process . env . NODE_ENV || 'development' ,
});
Common environment names: production, staging, development, qa, test
Environment-Specific Configuration
Conditional Initialization
Only initialize Sentry in certain environments:
if ( process . env . NODE_ENV === 'production' ) {
Sentry . init ({
dsn: '__DSN__' ,
environment: 'production' ,
});
}
Different Settings Per Environment
const sentryConfig = {
dsn: '__DSN__' ,
environment: process . env . NODE_ENV ,
};
if ( process . env . NODE_ENV === 'production' ) {
sentryConfig . tracesSampleRate = 0.1 ; // 10% in production
sentryConfig . debug = false ;
} else if ( process . env . NODE_ENV === 'staging' ) {
sentryConfig . tracesSampleRate = 0.5 ; // 50% in staging
sentryConfig . debug = false ;
} else {
sentryConfig . tracesSampleRate = 1.0 ; // 100% in development
sentryConfig . debug = true ;
}
Sentry . init ( sentryConfig );
Environment Variables
Node.js
import * as Sentry from '@sentry/node' ;
Sentry . init ({
dsn: process . env . SENTRY_DSN ,
environment: process . env . SENTRY_ENVIRONMENT ,
release: process . env . SENTRY_RELEASE ,
});
Using Webpack DefinePlugin or similar:
// webpack.config.js
const webpack = require ( 'webpack' );
module . exports = {
plugins: [
new webpack . DefinePlugin ({
'process.env.SENTRY_DSN' : JSON . stringify ( process . env . SENTRY_DSN ),
'process.env.NODE_ENV' : JSON . stringify ( process . env . NODE_ENV ),
}),
],
};
Then in your code:
import * as Sentry from '@sentry/browser' ;
Sentry . init ({
dsn: process . env . SENTRY_DSN ,
environment: process . env . NODE_ENV ,
});
Vite
Vite automatically exposes environment variables prefixed with VITE_:
// .env.production
VITE_SENTRY_DSN = https : //[email protected] /project-id
VITE_SENTRY_ENVIRONMENT = production
import * as Sentry from '@sentry/browser' ;
Sentry . init ({
dsn: import . meta . env . VITE_SENTRY_DSN ,
environment: import . meta . env . VITE_SENTRY_ENVIRONMENT ,
});
Development vs Production
Disabling in Development
Sentry . init ({
dsn: '__DSN__' ,
environment: process . env . NODE_ENV ,
enabled: process . env . NODE_ENV !== 'development' ,
});
Disabling Sentry in development means you won’t catch development-only bugs. Consider using filtering instead.
Development-Specific Settings
Sentry . init ({
dsn: '__DSN__' ,
environment: process . env . NODE_ENV ,
debug: process . env . NODE_ENV === 'development' ,
tracesSampleRate: process . env . NODE_ENV === 'development' ? 1.0 : 0.1 ,
});
Browser Extension Detection
The Browser SDK automatically detects browser extensions and disables itself by default:
Sentry . init ({
dsn: '__DSN__' ,
// Default: skipBrowserExtensionCheck: false
// Set to true to allow Sentry in browser extensions
skipBrowserExtensionCheck: true ,
});
Multiple Environments in the Same Project
Use environments to segment data in your Sentry project:
// Production deployment
Sentry . init ({
dsn: '__DSN__' ,
environment: 'production' ,
release: '[email protected] ' ,
});
// Staging deployment
Sentry . init ({
dsn: '__DSN__' ,
environment: 'staging' ,
release: '[email protected] ' ,
});
Then in Sentry’s UI, filter by environment to see only relevant issues.
Server-Side Environment Detection
Express.js
import express from 'express' ;
import * as Sentry from '@sentry/node' ;
const app = express ();
Sentry . init ({
dsn: '__DSN__' ,
environment: app . get ( 'env' ), // 'development' or 'production'
});
Vercel
Sentry . init ({
dsn: '__DSN__' ,
environment: process . env . VERCEL_ENV , // 'production', 'preview', or 'development'
});
AWS Lambda
Sentry . init ({
dsn: '__DSN__' ,
environment: process . env . AWS_EXECUTION_ENV ? 'production' : 'development' ,
});
Netlify
Sentry . init ({
dsn: '__DSN__' ,
environment: process . env . CONTEXT , // 'production', 'deploy-preview', or 'branch-deploy'
});
Framework-Specific Configuration
Next.js
Next.js supports .env.local, .env.production, etc.:
# .env.production
NEXT_PUBLIC_SENTRY_DSN = https://[email protected] /project-id
SENTRY_ENVIRONMENT = production
// sentry.client.config.ts
import * as Sentry from '@sentry/nextjs' ;
Sentry . init ({
dsn: process . env . NEXT_PUBLIC_SENTRY_DSN ,
environment: process . env . SENTRY_ENVIRONMENT ,
});
SvelteKit
// hooks.server.ts
import * as Sentry from '@sentry/sveltekit' ;
import { dev } from '$app/environment' ;
Sentry . init ({
dsn: '__DSN__' ,
environment: dev ? 'development' : 'production' ,
});
Best Practices
Use consistent environment names
Choose a standard set of environment names and use them consistently across all your projects. Common choices:
production
staging
development
qa / test
Don't hardcode sensitive values
Never commit DSN or other sensitive configuration to source control. Use environment variables: // ❌ Bad
Sentry . init ({ dsn: 'https://[email protected] /123' });
// ✅ Good
Sentry . init ({ dsn: process . env . SENTRY_DSN });
Configure sampling per environment
Enable debug mode in development
Debug mode helps troubleshoot SDK issues during development: Sentry . init ({
dsn: '__DSN__' ,
debug: process . env . NODE_ENV !== 'production' ,
});
Next Steps
Sampling Configuration Control data volume with sampling rates
Filtering Events Filter events before sending to Sentry