Syntax Error: TypeError: path must be a string

环境:vue-cli4 vue3 stylus
yarn serve之后的报错:Syntax Error: TypeError: path must be a string
debug:试过重新安装依赖包等,均无法解决。而后仔细查看报错信息,如下

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.

发现是css-loader的问题,因为之前配置过stylus,所以在vue.config.js中查看了一下配置,果然发现问题,把路径更改正确之后解决。

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

本人在博客中搜寻这个这个报错的解决方式时,发现大多数的这类报错(如下)都是由于css的渲染引起的。如果你有同样问题,不妨排查预处理器的配置、相关包的版本试一试。

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

猜你喜欢

转载自blog.csdn.net/qq_37291367/article/details/121603285