diff --git a/packages/next/server/dev/next-dev-server.ts b/packages/next/server/dev/next-dev-server.ts
index d360778905f4..11cbc454c0cd 100644
--- a/packages/next/server/dev/next-dev-server.ts
+++ b/packages/next/server/dev/next-dev-server.ts
@@ -273,12 +273,10 @@ export default class DevServer extends Server {
         })
       }
 
-      const wp = (this.webpackWatcher = new Watchpack({
-        ignored: /([/\\]node_modules[/\\]|[/\\]\.next[/\\]|[/\\]\.git[/\\])/,
-      }))
       const pages = this.pagesDir ? [this.pagesDir] : []
       const app = this.appDir ? [this.appDir] : []
       const directories = [...pages, ...app]
+
       const files = this.pagesDir
         ? getPossibleMiddlewareFilenames(
             pathJoin(this.pagesDir, '..'),
@@ -303,6 +301,15 @@ export default class DevServer extends Server {
       ]
       files.push(...tsconfigPaths)
 
+      const wp = (this.webpackWatcher = new Watchpack({
+        ignored: (pathname: string) => {
+          return (
+            !files.some((file) => file.startsWith(pathname)) &&
+            !directories.some((dir) => pathname.startsWith(dir))
+          )
+        },
+      }))
+
       wp.watch({ directories: [this.dir], startTime: 0 })
       const fileWatchTimes = new Map()
       let enabledTypeScript = this.usingTypeScript