Syntax Error: TypeError: path must be a string

Environment: Error reported after vue-cli4 vue3 stylus yarn serve: Syntax Error: TypeError: path must be a string
debug: Tried to reinstall dependent packages, etc., but it could not be resolved. Then carefully check the error message, as follows

Syntax Error: TypeError: path must be a string

@ ./node_modules/vue-style-loader??ref--12-oneOf-1-0!./node_modules/css-loader/dist/cjs.js??ref--12-oneOf-1-1!./node_modules/vue-loader-v16/dist/stylePostLoader.js!./node_modules/postcss-loader/src??ref--12-oneOf-1-2!./node_modules/stylus-loader??ref--12-oneOf-1-3!./node_modules/cache-loader/dist/cjs.js??ref--1-0!./node_modules/vue-loader-v16/dist??ref--1-1!./src/layout/index.vue?vue&type=style&index=0&id=13877386&lang=stylus&scoped=true 4:14-455 15:3-20:5 16:22-463
 @ ./src/layout/index.vue?vue&type=style&index=0&id=13877386&lang=stylus&scoped=true
 @ ./src/layout/index.vue
 @ ./src/router/index.js
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://xx.xx.xxxx:8080&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

internal/validators.js:117
    throw new ERR_INVALID_ARG_TYPE(name, 'string', value);
    ^

TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received undefined
    at validateString (internal/validators.js:117:11)
    at Object.dirname (path.js:583:5)
    at WatcherManager.watchFile (D:\vue3-project\node_modules\watchpack\lib\watcherManager.js:27:23)
    at Watchpack.<anonymous> (D:\vue3-project\node_modules\watchpack\lib\watchpack.js:38:49)
    at Array.map (<anonymous>)
    at Watchpack.watch (D:\vue3-project\node_modules\watchpack\lib\watchpack.js:37:28)
    at NodeWatchFileSystem.watch (D:\vue3-project\node_modules\webpack\lib\node\NodeWatchFileSystem.js:70:16)
    at Watching.watch (D:\vue3-project\node_modules\webpack\lib\Watching.js:114:48)
    at D:\vue3-project\node_modules\webpack\lib\Watching.js:101:10
    at AsyncSeriesHook.eval [as callAsync] (eval at create (D:\vue3-project\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:58:1)
    at AsyncSeriesHook.lazyCompileHook (D:vue3-project\node_modules\tapable\lib\Hook.js:154:20)
    at Watching._done (D:\vue3-project\node_modules\webpack\lib\Watching.js:98:28)
    at D:\vue3-project\node_modules\webpack\lib\Watching.js:73:19
    at Compiler.emitRecords (D:\vue3-project\node_modules\webpack\lib\Compiler.js:499:39)
    at D:\vue3-project\node_modules\webpack\lib\Watching.js:54:20
    at D:\vue3-project\node_modules\webpack\lib\Compiler.js:485:14 {
    
    
  code: 'ERR_INVALID_ARG_TYPE'
}
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

It was found that it was a css-loader problem. Because stylus had been configured before, I checked the configuration in vue.config.js and found the problem. I changed the path correctly and solved it.

// vue.config.js
css: {
    
    
    loaderOptions: {
    
    
      // 给 stylus-loader 传递选项
      stylus: {
    
    
        import: '~@/styles/index.styl'  // 此处地址更正
      }
    }
  }

When I searched for the solution to this error in the blog, I found that most of these errors (as follows) are caused by the rendering of css. If you have the same problem, you may wish to check the configuration of the preprocessor and the version of the relevant package to try.

The “path“ argument must be of type string. Received undefined