Cannot find module 'X' or its corresponding type declarations

Option 1: Install the package and its types

npm install lodash
npm install --save-dev @types/lodash

Option 2: Configure path aliases in tsconfig.json

// tsconfig.json
{
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "@/*": ["./src/*"],
      "@/components/*": ["./src/components/*"]
    }
  }
}

Option 3: Enable JSON module resolution

// tsconfig.json
{
  "compilerOptions": {
    "resolveJsonModule": true
  }
}

Option 4: Declare an untyped module manually

// types/declarations.d.ts
declare module 'some-untyped-library' {
  const value: any;
  export default value;
}

What does TS2307 mean?

TS2307 means TypeScript can't find the module you're trying to import. Either the package isn't installed, it has no TypeScript types, the path is wrong, or tsconfig isn't configured to resolve it.

How do I fix TS2307 for an npm package?

First install the package: npm install package-name. If it's a JavaScript-only package, also install types: npm install --save-dev @types/package-name. If no @types exists, declare the module in a .d.ts file.

TS2307 for a local file — how to fix?

Check the relative path is correct. If you're using path aliases like @/ make sure they're configured in both tsconfig.json paths and your bundler (webpack, vite, etc.).

TS2307 for .svg or .png files — how to fix?

Declare the file type in a .d.ts file: declare module '*.svg' { const content: string; export default content; }. Same for .png, .css modules, etc.

TS2307 after upgrading TypeScript — why?

Newer TypeScript versions enforce stricter module resolution. Check moduleResolution in tsconfig — switching to 'bundler' or 'node16' often resolves this after version upgrades.