Module not found: Error: Can't resolve './components/Header'

Webpack can’t find the file you’re importing.

Fix 1: Check the file path

// ❌ Wrong path or missing extension
import Header from './components/Header';

// ✅ Check the actual file location
import Header from './components/Header.jsx';

Fix 2: Configure resolve extensions

// webpack.config.js
module.exports = {
  resolve: {
    extensions: ['.js', '.jsx', '.ts', '.tsx'],
  },
};

Fix 3: Missing package

npm install missing-package

Fix 4: Case sensitivity

File systems on Linux are case-sensitive:

// ❌ Wrong case (works on Mac, fails on Linux)
import Header from './components/header';

// ✅ Match exact filename
import Header from './components/Header';

Related resources

• JavaScript array methods cheat sheet
• JavaScript complete guide