错误:未捕获(承诺中)类型错误:n.swapComponent 不是函数

Posted

技术标签:

【中文标题】错误:未捕获(承诺中)类型错误:n.swapComponent 不是函数【英文标题】:Error: Uncaught (in promise) TypeError: n.swapComponent is not a function 【发布时间】:2021-04-11 18:28:42 【问题描述】:

我正在使用 Laravel 和 Jetsream 以及 Vuejs & Inertia 堆栈开发一个应用程序,并且在运行 npm audit fix 后我的应用程序中出现了一个空白页面。

我在收到一条消息后运行 npm 命令npm audit fix 存在 3 个高严重性漏洞。这是输出:

npm WARN deprecated axios@0.19.2: Critical security vulnerability fixed in v0.21.1. For more information, see https://github.com/axios/axios/pull/3410
npm WARN @inertiajs/inertia-vue@0.2.4 requires a peer of @inertiajs/inertia@^0.2.0 || ^0.3.0 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.13 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted "os":"darwin","arch":"any" (current: "os":"win32","arch":"x64")
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.1.3: wanted "os":"darwin","arch":"any" (current: "os":"win32","arch":"x64")

+ axios@0.21.1
+ @inertiajs/inertia@0.8.2
added 4 packages from 5 contributors and updated 2 packages in 4.307s

55 packages are looking for funding
  run `npm fund` for details

fixed 2 of 3 vulnerabilities in 1150 scanned packages
  1 vulnerability required manual review and could not be updated

自从运行该命令后,网站上的每个页面都是空白的,并且在控制台中显示以下错误:

app.js:121 Uncaught (in promise) TypeError: n.swapComponent is not a function
    at app.js:121
(anonymous) @ app.js:121
Promise.then (async)
setPage @ app.js:121
handleInitialPageVisit @ app.js:121
init @ app.js:121
created @ app.js:108
invokeWithErrorHandling @ app.js:104023
callHook @ app.js:106380
Vue._init @ app.js:107162
VueComponent @ app.js:107307
createComponentInstanceForVnode @ app.js:105450
init @ app.js:105281
createComponent @ app.js:108133
createElm @ app.js:108080
patch @ app.js:108669
Vue._update @ app.js:106106
updateComponent @ app.js:106227
get @ app.js:106638
Watcher @ app.js:106627
mountComponent @ app.js:106234
./node_modules/vue/dist/vue.common.dev.js.Vue.$mount @ app.js:111204
./node_modules/vue/dist/vue.common.dev.js.Vue.$mount @ app.js:114104
./resources/js/app.js @ app.js:120619
__webpack_require__ @ app.js:20
0 @ app.js:120679
__webpack_require__ @ app.js:20
(anonymous) @ app.js:84
(anonymous) @ app.js:87

我是 laravel/this stack 的新手,如果有任何帮助追踪此问题的根源,我将不胜感激。

【问题讨论】:

【参考方案1】:

尝试将包 @inertiajs/inertia-vue 更新到最新版本“^0.5.4”。

在 package.json 中设置 "@inertiajs/inertia-vue": "^0.5.4" 并运行 npm install

从我这里工作!

【讨论】:

不幸的是它对我不起作用:(我不得不恢复。我将查看 v2 中包含的新 Laravel Jetstream 更新,看看是否可以解决我自己的问题。 我试过了,它删除了上面列出的错误,但我的项目仍然坏了,我收到了其他几个控制台错误,影响 TypeError: Cannot read property 'message' of undefined 的任何和所有 $page 变量/props等等。我不确定到底发生了什么,但似乎 vue 无法正常工作,我尝试将所有软件包更新为最新版本,但没有成功。 这个组合对我有用:惯性:^0.8.4 和惯性-vue:^0.5.5【参考方案2】:

升级时遇到同样的问题

来自:


"@inertiajs/inertia": "^0.1.9",

"@inertiajs/inertia": "^0.8.2",

由于是 GitHub 安全审计建议的,所以现在我只回复^0.1.9

【讨论】:

【参考方案3】:

npm update 后我也遇到了同样的问题,为了解决这个问题,我降级了惯性包。在 package.json "@inertiajs/inertia": "^0.1.7" 然后 npm 安装。

【讨论】:

以上是关于错误:未捕获(承诺中)类型错误:n.swapComponent 不是函数的主要内容,如果未能解决你的问题,请参考以下文章

未捕获(承诺中)类型错误:无法读取未定义的属性“uid”

错误:未捕获(承诺中)类型错误:n.swapComponent 不是函数

未捕获(承诺中)类型错误:无法读取未定义的属性“协议”

未捕获(承诺)类型错误:尝试打开窗口时出现问题

如何修复此错误:未捕获(承诺)类型错误:无法读取未定义的属性(读取“长度”)

在与 API 调用关联的函数中:未捕获(承诺中)类型错误:无法读取未定义的属性“包含”