Skip to content

Commit 0bfeb0e

Browse files
committed
Add Avoid Conflicting Files as a Next.js TIL
1 parent e91b163 commit 0bfeb0e

File tree

2 files changed

+38
-1
lines changed

2 files changed

+38
-1
lines changed

README.md

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ pairing with smart people at Hashrocket.
1010

1111
For a steady stream of TILs, [sign up for my newsletter](https://crafty-builder-6996.ck.page/e169c61186).
1212

13-
_1434 TILs and counting..._
13+
_1435 TILs and counting..._
1414

1515
---
1616

@@ -634,6 +634,7 @@ _1434 TILs and counting..._
634634

635635
### Next.js
636636

637+
- [Avoid Conflicting Files](nextjs/avoid-conflicting-files.md)
637638
- [Create Files And Directories For Dynamic Routes](nextjs/create-files-and-directories-for-dynamic-routes.md)
638639
- [Define URL Redirects In The Next Config](nextjs/define-url-redirects-in-the-next-config.md)
639640
- [Fetch Does Not Work In API Serverless Function](nextjs/fetch-does-not-work-in-api-serverless-function.md)

nextjs/avoid-conflicting-files.md

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
# Avoid Conflicting Files
2+
3+
When Next.js is bundling and building your project, it will get completely
4+
tripped up by any instance of conflicting project files. What I mean by
5+
conflicting project files are two JavaScript or TypeScript (or flavors of JSX
6+
files) that would resolve to the same thing.
7+
8+
Here is one example where the extensions differ:
9+
10+
```
11+
src/pages/welcome.tsx
12+
src/pages/welcome.jsx
13+
```
14+
15+
Here is another example where the paths differ but the bundled result would
16+
conflict:
17+
18+
```
19+
src/pages/welcome.tsx
20+
src/pages/welcome/index.tsx
21+
```
22+
23+
If you have any instances of these conflicting files, you'll be presented with
24+
a beguiling and cryptic error message when trying to run the dev server.
25+
26+
```
27+
TypeError [ERR_INVALID_ARG_TYPE]: The "to" argument must be of type string. Received undefined
28+
at new NodeError (node:internal/errors:405:5)
29+
at validateString (node:internal/validators:162:11)
30+
at Object.relative (node:path:1191:5)
31+
at Watchpack.<anonymous> (/my_app/node_modules/.pnpm/[email protected]_@[email protected][email protected][email protected]/node_modules/next/dist/server/lib/router-utils/setup-dev-bundler.js:381:55) {
32+
code: 'ERR_INVALID_ARG_TYPE'
33+
}
34+
```
35+
36+
One of those files needs to go. Remove one of them and you'll be good to go.

0 commit comments

Comments
 (0)