CLI tool throws an error when a watched file is changed by GIT

[dannywebb]

What version of Tailwind CSS are you using?

v3.3.3

What build tool (or framework if it abstracts the build tool) are you using?

gulp 4.0.2

What version of Node.js are you using?

v16.14.2

What browser are you using?

CLI

What operating system are you using?

FreeBSD

Describe your issue

The issues can be reproduced in the following way:

1. I run the CLI to watch the project directory and build when a file is changed:
   npx tailwindcss -i ./src/input.css -o ./dist/output.css --watch
2. When I change any file by the code editor it triggers the compilation just fine.
   But, if a file is changed by GIT for instance git checkout test.php it throws the following error:

   node:internal/validators:120
       throw new ERR_INVALID_ARG_TYPE(name, 'string', value);
       ^
   
   TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received null
       at new NodeError (node:internal/errors:371:5)
       at validateString (node:internal/validators:120:11)
       at Object.join (node:path:1172:7)
       at FSWatcher.<anonymous> (/project/.src/node_modules/tailwindcss/lib/cli/build/watching.js:135:81)
       at FSWatcher.emit (node:events:526:28)
       at FSWatcher._emitRaw (/project/.src/node_modules/chokidar/index.js:384:37)
       at /project/.src/node_modules/chokidar/lib/nodefs-handler.js:137:5
       at Set.forEach (<anonymous>)
       at foreach (/project/.src/node_modules/chokidar/lib/nodefs-handler.js:39:9)
       at fsWatchBroadcast (/project/.src/node_modules/chokidar/lib/nodefs-handler.js:136:3) {
     code: 'ERR_INVALID_ARG_TYPE'
   }

I fixed the issue by the following patch:

--- a/node_modules/tailwindcss/lib/cli/build/watching.js
+++ b/node_modules/tailwindcss/lib/cli/build/watching.js
@@ -126,7 +126,7 @@ function createWatcher(args, { state , rebuild  }) {
     // This is very likely a chokidar bug but it's one we need to work around
     // We treat this as a change event and rebuild the CSS
     watcher.on("raw", (evt, filePath, meta)=>{
-        if (evt !== "rename") {
+        if (evt !== "rename" || null === filePath) {
             return;
         }
         let watchedPath = meta.watchedPath;

[thecrypticace]

This should be fixed by #12193, and will be available in the next release.

You can try it before then by using our insiders build — this may take about 15m to build and publish:

npm install tailwindcss@insiders

[dannywebb]

I've just updated TW to the latest version and it works just fine! Thank you very much, I appreciate your quick reaction!