Fix React Project Error: Digital Envelope Routines in IntelliJ IDEA

This error occurs due to Node.js version compatibility issues with webpack’s cryptographic hash functions. The most effective solutions are to either upgrade Node.js to a compatible version or configure webpack to use legacy hash algorithms that work with your current Node.js installation.

Contents

• Understanding the Error
• Root Causes
• Multiple Solutions
  • Solution 1: Upgrade Node.js
  • Solution 2: Use Legacy Node.js Flag
  • Solution 3: Update Dependencies
  • Solution 4: Modify Webpack Configuration
• IntelliJ IDEA Specific Considerations
• Prevention Tips
• Troubleshooting Steps

Understanding the Error

The error error:0308010C:digital envelope routines::unsupported is a Node.js cryptographic error that occurs when webpack tries to create hash functions during the build process. This error typically manifests when:

• Using Node.js 17+ with older webpack versions (pre-5.61.0)
• Using Node.js 16.13.0+ with older versions of webpack plugins
• There’s an OpenSSL version incompatibility between Node.js and the webpack build tools

The stack trace shows the error originates from webpack’s createHash.js file, specifically when it attempts to use cryptographic hash algorithms that aren’t supported by the current Node.js version.

**Key Insight**: This error became more common after Node.js 17.0.0 introduced stricter OpenSSL requirements for cryptographic operations, breaking compatibility with older webpack configurations.

Root Causes

Several factors contribute to this error:

1. Node.js Version Mismatch: Using Node.js 17+ with webpack versions that don’t support the new cryptographic requirements
2. OpenSSL Version Conflicts: Different OpenSSL versions between Node.js and system libraries
3. Outdated Webpack Dependencies: React projects created with older webpack versions
4. Environment Variables: Missing Node.js environment variables that configure legacy crypto support
5. IntelliJ IDEA Configuration: IDE-specific settings or terminal configurations that affect Node.js execution

The error specifically occurs because webpack is trying to use node:internal/crypto/hash routines that were changed or deprecated in newer Node.js versions.

Multiple Solutions

Solution 1: Upgrade Node.js

The most reliable solution is to upgrade Node.js to a version that fully supports webpack’s requirements:

1. Download and install Node.js 18.x or later from nodejs.org
2. Verify the installation: node --version (should show v18.x or higher)
3. Reinstall project dependencies:
   bash

   rm -rf node_modules package-lock.json
   npm install
   

This solution works because newer Node.js versions include updated OpenSSL support that webpack expects.

Solution 2: Use Legacy Node.js Flag

If you need to keep your current Node.js version, add the legacy flag to enable older crypto routines:

1. For npm scripts: Modify your package.json scripts:

   json

   "scripts": {
     "start": "NODE_OPTIONS=--openssl-legacy-provider react-scripts start",
     "build": "NODE_OPTIONS=--openssl-legacy-provider react-scripts build",
     "test": "NODE_OPTIONS=--openssl-legacy-provider react-scripts test"
   }
   

2. For direct execution: Run commands with the flag:

   bash

   NODE_OPTIONS=--openssl-legacy-provider npm start
   

3. For IntelliJ IDEA: Configure the Node.js interpreter in IDE settings or add the flag to your run configuration.

Solution 3: Update Dependencies

Update your project’s webpack and related dependencies to compatible versions:

1. Update react-scripts to the latest version:

   bash

   npm install react-scripts@latest
   

2. Update webpack and related packages:

   bash

   npm install webpack@latest webpack-cli@latest
   

3. Check for outdated peer dependencies:

   bash

   npm outdated
   npm update
   

Solution 4: Modify Webpack Configuration

If you have a custom webpack configuration, modify the hash creation settings:

1. In your webpack.config.js, add or modify the createHash configuration:

   javascript

   module.exports = {
     // ... other configurations
     optimization: {
       runtimeChunk: 'single',
       splitChunks: {
         chunks: 'all',
         cacheGroups: {
           vendors: {
             test: /[\\/]node_modules[\\/]/,
             name: 'vendors',
             chunks: 'all',
           },
         },
       },
     },
     // Add this to handle the crypto issue
     output: {
       hashFunction: 'sha256',
       hashDigest: 'hex',
       hashDigestLength: 20,
     }
   };
   

2. For TypeScript projects, ensure your tsconfig.json includes the necessary webpack types.

IntelliJ IDEA Specific Considerations

When working in IntelliJ IDEA, consider these IDE-specific solutions:

Configure Node.js Interpreter

1. Go to File → Settings → Languages & Frameworks → Node.js and NPM
2. Make sure you’re using the correct Node.js version
3. Set the Node.js home path to your preferred Node.js installation

Modify Run Configurations

1. Go to Run → Edit Configurations
2. Select your React app configuration
3. In the Environment variables section, add:
   NODE_OPTIONS=--openssl-legacy-provider
   

Use Terminal Integration

1. Open the built-in terminal in IntelliJ IDEA (View → Tool Windows → Terminal)
2. Run commands with the legacy provider flag:
   bash

   NODE_OPTIONS=--openssl-legacy-provider npm start
   

Project Structure Considerations

• Ensure .idea folder and workspace settings are compatible with your Node.js version
• Check for IDE-specific webpack configurations that might conflict

Prevention Tips

To avoid this error in future projects:

1. Use Node Version Manager: Use tools like nvm or nodenv to manage Node.js versions:

   bash

   nvm install 18
   nvm use 18
   

2. Specify Node.js Version: In your package.json:

   json

   "engines": {
     "node": ">=18.0.0"
   }
   

3. Use Docker: Create a containerized environment with consistent Node.js versions:

   dockerfile

   FROM node:18-alpine
   WORKDIR /app
   COPY package*.json ./
   RUN npm install
   COPY . .
   CMD ["npm", "start"]
   

4. Regular Updates: Keep dependencies updated by running:

   bash

   npm audit fix
   npm update
   

5. Environment Configuration: Create a .env file with Node.js configuration:

   NODE_OPTIONS=--openssl-legacy-provider
   

Troubleshooting Steps

If none of the above solutions work, follow these troubleshooting steps:

1. Check Node.js Version:

   bash

   node --version
   npm --version
   

2. Verify OpenSSL Support:

   bash

   node -e "console.log(process.versions.openssl)"
   

3. Clean Reinstall:

   bash

   rm -rf node_modules package-lock.json
   npm cache clean --force
   npm install
   

4. Check for Conflicting Packages:

   bash

   npm ls webpack
   npm ls react-scripts
   

5. Test in Different Environment: Try running the project outside IntelliJ IDEA to isolate IDE-specific issues.

6. Check System Environment: Ensure no system-wide Node.js installations are conflicting with your project setup.

---

Sources

1. Node.js Official Documentation - OpenSSL Provider
2. Webpack GitHub Issue - Digital Envelope Routines
3. Create React App Documentation - Node.js Requirements
4. IntelliJ IDEA Node.js Integration Guide
5. Node.js Version Compatibility Table

Conclusion

The “digital envelope routines::unsupported” error is a common Node.js compatibility issue that can be resolved through several approaches. The most reliable solutions are either upgrading Node.js to version 18+ or using the --openssl-legacy-provider flag to maintain compatibility with your current setup. For IntelliJ IDEA users, configuring the Node.js interpreter properly and adding the environment variable to run configurations ensures smooth operation. By following the prevention tips and keeping your dependencies updated, you can avoid this issue in future React projects. Always test your solution in a clean environment to ensure the fix works properly before committing to your development workflow.