nextjs - 💡(How to fix) Fix Next.js Incorrectly Detects Routing Conflict Between [id] and [projectId] [1 comments, 2 participants]

Link to the code that reproduces this issue

https://github.com/PhoenixWild29/empowergrid-project/tree/master

To Reproduce

1. Create the following route structure:

   pages/api/projects/
     ├── [id].ts
     └── [id]/
         ├── bookmark.ts
         ├── fund.ts
         ├── funding-progress.ts
         ├── milestones.ts
         └── governance/
             └── proposals.ts

2. Run npm run dev

3. Next.js reports the routing conflict error and server fails to start

Current vs. Expected behavior

Expected Behavior

Next.js should accept this route structure:

• pages/api/projects/[id].ts - handles /api/projects/[id]
• pages/api/projects/[id]/ - handles /api/projects/[id]/...

This is a valid Next.js route structure and should not cause conflicts.

Actual Behavior

Next.js incorrectly detects a conflict between [id] and [projectId] and crashes during server startup, preventing the application from running.

Provide environment information

## Environment

- **Next.js Version:** 14.2.32 (also tested with 16.0.1 - error persists)
- **Node.js Version:** (please check with `node --version`)
- **Operating System:** Windows 10
- **Package Manager:** npm

Which area(s) are affected? (Select all that apply)

Pages Router

Which stage(s) are affected? (Select all that apply)

next dev (local)

Additional context

Route Structure

Actual File System:

pages/api/projects/
  ├── [id].ts                    ✅ EXISTS
  ├── [id]/                      ✅ EXISTS (directory)
  │   ├── bookmark.ts
  │   ├── fund.ts
  │   ├── funding-progress.ts
  │   ├── milestones.ts
  │   └── governance/
  │       └── proposals.ts
  ├── index.ts
  ├── compare.ts
  └── search/
      └── suggestions.ts

What Next.js Reports:

• Next.js claims there's a conflict between [id] and [projectId] at the same path level
• NO [projectId] file or directory exists in pages/api/projects/

Investigation Steps Taken

1. ✅ Manual File System Check

   • Verified no [projectId] file or directory exists
   • Checked for hidden files
   • Verified file names are correct (no typos or hidden characters)

2. ✅ Recreated Directory Structure

   • Deleted and recreated [id] directory
   • Restored all files
   • Error persists

3. ✅ Next.js Version Testing

   • Updated to Next.js 16.0.1 - error persists
   • Downgraded to 14.2.32 - error persists

4. ✅ Configuration Check

   • No route rewrites/redirects in next.config.js
   • No route-related configuration issues found

5. ✅ Route File Analysis

   • No route files found that use both [id] and [projectId] patterns
   • No route files found that Next.js might be misinterpreting

6. ✅ Isolation Testing

   • Removed [id].ts file - error persists (issue is with [id]/ directory)
   • Error occurs during route tree construction in Next.js

7. ✅ Cache Clearing

   • Cleared .next directory
   • Cleared node_modules/.cache
   • Error persists

Additional Context

• The error occurs in Next.js's internal route sorting/validation logic (sorted-routes.js)
• The handleSlug function is detecting a conflict that doesn't exist in the actual file system
• Other routes in the project use [projectId] in different paths (e.g., api/recommendations/similar/[projectId].ts), but they are in completely different directory structures and should not conflict

Impact

• Severity: Critical
• Impact: Application cannot start - returns 500 Internal Server Error
• Workaround: None found yet

Possible Related Issues

This might be related to how Next.js handles nested dynamic routes or route tree construction. The error suggests Next.js is incorrectly identifying route conflicts during the route sorting/validation phase.

Additional Information

• The error persists even when [id].ts is removed, indicating the issue is specifically with the [id]/ directory structure
• No route rewrites, redirects, or other configuration that could cause this
• File system has been manually verified multiple times

Note: This bug prevents the application from starting, making it impossible to use Next.js with this route structure. Any help or workaround would be greatly appreciated.