Development Server Configuration Utility

Create a utility that helps developers configure and manage a React development server with custom settings. The utility should provide functions to generate development server configuration and handle common customization scenarios.

Requirements

Your utility should provide the following capabilities:

1. Port Configuration: Determine which port the development server should use by checking environment variables and defaults
2. HTTPS Setup: Determine if HTTPS mode should be enabled based on environment configuration
3. Browser Launch Control: Determine which browser should be opened when the server starts (or if auto-launch should be disabled)
4. Proxy Configuration: Validate proxy settings to ensure they are properly formatted for the development server

The utility should read from environment variables and configuration objects to determine appropriate settings. All functions should handle edge cases gracefully.

Implementation Details

Create a module devServerConfig.js that exports four functions:

1. getPortConfig(defaultPort, envPort) - Returns the port to use, preferring environment variable over default
2. shouldUseHttps(envHttps, envSslCert, envSslKey) - Returns boolean indicating if HTTPS should be enabled
3. getBrowserConfig(envBrowser) - Returns the browser to launch or 'none' to disable auto-launch
4. validateProxyConfig(proxyConfig) - Returns true if proxy config is valid (string or object), false otherwise

@generates

Test Cases

• Given envPort is '3005' and defaultPort is 3000, getPortConfig returns 3005 @test
• Given envPort is undefined and defaultPort is 3000, getPortConfig returns 3000 @test
• Given envHttps is 'true', shouldUseHttps returns true regardless of cert/key presence @test
• Given all HTTPS env variables are undefined, shouldUseHttps returns false @test
• Given envBrowser is 'chrome', getBrowserConfig returns 'chrome' @test
• Given envBrowser is 'none', getBrowserConfig returns 'none' @test
• Given proxyConfig is 'http://localhost:5000', validateProxyConfig returns true @test
• Given proxyConfig is an object with a target property, validateProxyConfig returns true @test
• Given proxyConfig is null or a number, validateProxyConfig returns false @test

API

/**
 * Determines the port to use for the development server
 * @param {number} defaultPort - The default port (usually 3000)
 * @param {string|undefined} envPort - Port from environment variable
 * @returns {number} The port number to use
 */
function getPortConfig(defaultPort, envPort) {
  // Implementation here
}

/**
 * Determines if HTTPS should be enabled
 * @param {string|undefined} envHttps - HTTPS flag from environment
 * @param {string|undefined} envSslCert - Path to SSL certificate
 * @param {string|undefined} envSslKey - Path to SSL key
 * @returns {boolean} Whether HTTPS should be enabled
 */
function shouldUseHttps(envHttps, envSslCert, envSslKey) {
  // Implementation here
}

/**
 * Determines which browser to open
 * @param {string|undefined} envBrowser - Browser name from environment
 * @returns {string} Browser name or 'none' to disable
 */
function getBrowserConfig(envBrowser) {
  // Implementation here
}

/**
 * Validates proxy configuration
 * @param {*} proxyConfig - Proxy configuration (string or object)
 * @returns {boolean} Whether the proxy config is valid
 */
function validateProxyConfig(proxyConfig) {
  // Implementation here
}

module.exports = {
  getPortConfig,
  shouldUseHttps,
  getBrowserConfig,
  validateProxyConfig
};

Dependencies { .dependencies }

react-scripts { .dependency }

Provides the development server infrastructure and configuration system for Create React App projects.