执行npm run dev时触发TypeError [ERR_INVALID_ARG_TYPE]错误求助

问题 #

技术栈：Laravel/Vue、laravel-mix、webpack，项目此前运行正常，近日执行npm run dev时出现以下错误：

TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received an instance of Object
    at new NodeError (node:internal/errors:387:5)
    at validateString (node:internal/validators:162:11)
    at Object.isAbsolute (node:path:1157:5)
    at standardizeName (/var/www//node_modules/@babel/core/lib/config/files/plugins.js:76:15)
    at resolveAlternativesHelper (/var/www//node_modules/@babel/core/lib/config/files/plugins.js:81:28)
    at resolveAlternativesHelper.next (<anonymous>)
    at resolveStandardizedNameForRequire (/var/www//node_modules/@babel/core/lib/config/files/plugins.js:159:16)
    at resolveStandardizedName (/var/www//node_modules/@babel/core/lib/config/files/plugins.js:182:12)
    at /var/www//node_modules/babel-merge/dist/index.js:24:24
    at Array.find (<anonymous>)
    at /var/www//node_modules/babel-merge/dist/index.js:23:28
    at Array.reduce (<anonymous>)
    at mergeArray (/var/www//node_modules/babel-merge/dist/index.js:20:36)
    at babelMerge (/var/www//node_modules/babel-merge/dist/index.js:40:19)
    at /var/www//node_modules/babel-merge/dist/index.js:60:26
    at Array.reduce (<anonymous>)
    at Function.value (/var/www//node_modules/babel-merge/dist/index.js:58:49)
    at Function.generate (/var/www//node_modules/laravel-mix/src/BabelConfig.js:11:22)
    at Object.babel (/var/www//node_modules/laravel-mix/src/config.js:123:45)
    at JavaScript.webpackRules (/var/www//node_modules/laravel-mix/src/components/JavaScript.js:76:41)
    at ComponentFactory.applyRules (/var/www//node_modules/laravel-mix/src/components/ComponentFactory.js:155:23)
    at /var/www//node_modules/laravel-mix/src/components/ComponentFactory.js:66:48
    at /var/www//node_modules/laravel-mix/src/Dispatcher.js:34:47
    at Array.forEach (<anonymous>)
    at Dispatcher.fire (/var/www//node_modules/laravel-mix/src/Dispatcher.js:34:28)
    at Mix.dispatch (/var/www//node_modules/laravel-mix/src/Mix.js:118:25)
    at WebpackConfig.buildRules (/var/www//node_modules/laravel-mix/src/builder/WebpackConfig.js:90:13)
    at WebpackConfig.build (/var/www//node_modules/laravel-mix/src/builder/WebpackConfig.js:23:14)
    at Object.<anonymous> (/var/www//node_modules/laravel-mix/setup/webpack.config.js:29:38)
    at Module._compile (/var/www//node_modules/v8-compile-cache/v8-compile-cache.js:192:30) {
  code: 'ERR_INVALID_ARG_TYPE'
}

当前webpack.mix.js配置：

const mix = require('laravel-mix');


 mix.js('resources/js/app.js', 'public/js')
    .js('resources/js/bootstrap.js', 'public/js')
    .sass('resources/sass/app.scss', 'public/css');

package.json配置：

{
  "private": true,
  "scripts": {
    "dev": "npm run development",
    "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "npm run development -- --watch",
    "watch-poll": "npm run watch -- --watch-poll",
    "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --disable-host-check --config=node_modules/laravel-mix/setup/webpack.config.js",
    "prod": "npm run production",
    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },
  "devDependencies": {
    "axios": "^0.19",
    "bootstrap": "^4.5.3",
    "cross-env": "^7.0.3",
    "google-fonts-webpack-plugin": "^0.4.4",
    "html-webpack-plugin": "^4.5.0",
    "http-server": "^0.12.3",
    "jquery": "^3.2",
    "laravel-mix": "^5.0.7",
    "lodash": "^4.17.19",
    "popper.js": "^1.12",
    "prerender-spa-plugin": "^3.4.0",
    "resolve-url-loader": "^3.1.2",
    "sass": "^1.27.0",
    "sass-loader": "^8.0.0",
    "vue": "^2.6.12",
    "vue-stripe-elements-plus": "^1.0.1",
    "vue-template-compiler": "^2.6.12"
  },
  "dependencies": {
    "@vue-stripe/vue-stripe": "^4.2.5",
    "bootstrap-vue": "^2.18.1",
    "mixpanel-browser": "^2.50.0",
    "moment": "^2.29.1",
    "vee-validate": "^3.4.3",
    "vee-validate-laravel": "^1.1.0",
    "vue-analytics": "^5.22.1",
    "vue-country-flag": "^2.0.1",
    "vue-facebook-pixel": "^1.2.1",
    "vue-meta": "^2.4.0",
    "vue-mixpanel": "^1.0.7",
    "vue-router": "^3.4.8",
    "vue-tinymce-editor": "^1.6.2",
    "vuedraggable": "^2.24.3",
    "vuex": "^3.4.0"
  }
}

已尝试删除node_modules和package-lock.json后重新安装依赖，问题仍未解决，需定位错误来源并修复。

解决方案 #

这个错误源于babel-merge包与当前依赖版本不兼容，合并Babel配置时传递了对象而非字符串路径，可通过以下方式解决：

• 锁定babel-merge版本为^3.0.0：
  在package.json的devDependencies中添加"babel-merge": "^3.0.0"，然后执行：

  rm -rf node_modules package-lock.json
  npm install
  

• 升级laravel-mix到稳定版本：
  将laravel-mix版本从^5.0.7升级到^5.0.9（该版本修复了Babel配置合并问题），执行：

  npm install laravel-mix@5.0.9 --save-dev
  rm -rf node_modules package-lock.json
  npm install
  

• 检查自定义Babel配置文件：
  若项目根目录存在.babelrc或babel.config.js，确保插件/预设配置为字符串格式，避免使用对象。比如将：

  {
    "plugins": [{"name": "@babel/plugin-transform-runtime"}]
  }
  

  修改为：

  {
    "plugins": ["@babel/plugin-transform-runtime"]
  }
  

内容的提问来源于stack exchange，提问作者Artur Geghamyan