看到這篇文章算你運氣好！因為只有我才能給你答案！看到就賺到，這就是緣分

因為vue3遷移nuxt3是一個非常困難和痛苦的過程，中間會有各種報錯，各種不兼容，各種亂七八糟但是你又找不到答案的問題。

而且你一定會遇到這個onMounted不執(zhí)行的問題！

現象如下：

上面可以看到無論瀏覽器console還是cmd命令行的輸出都沒有執(zhí)行onMounted中的語句。

onMounted不執(zhí)行是一個非常嚴重的問題，這意味著，你的異步請求都沒法在頁面掛載之前成功發(fā)起，那么html就會因為沒有ajax數據而沒法渲染！

?我在nuxt3的github提過一個問怎么解決這個issue的問題，并且提供了復現問題的鏈接，結果nuxt3的開源作者說：他們不看實際項目中的這種復現，他們只看最小環(huán)境中是否存在這種問題，讓我在最小環(huán)境復現這個問題。如果最小環(huán)境中沒有問題，就不是框架的問題。

雖然他們說的有點道理，但我還是忍不住要噴他們：誰會只在最小環(huán)境開發(fā)？！就是因為真實環(huán)境中的各種因素的互相影響，才能考驗框架的健壯性！用最小環(huán)境來復現問題做評判，顯示是片面和缺乏說法力的，這是一種偷懶行為！ 要是都用最小環(huán)境來復現，還要他們這些人開發(fā)個毛的框架，直接說evething is ok，no any bug就得了。

這是扯了句題外話，我經過了大概一天的測試和思考，一直沒有找到原因。

開始吐槽nuxt的垃圾和難用，但是內心的不服輸仍然推動著我必須解決這個問題！

在今天早上出去鍛煉吸收了天地靈氣之后，回到家里，頭腦一片清凈，在某個靈感涌現的瞬間找到了一點線索（這本是不起眼的一個地方）：

import { Player, VHeader, VTab } from "@/components";

export default defineComponent({

? name: "App",

? components: {

? ? VHeader,

? ? VTab,

? ? Player,

? },

在app.vue里我手動導入了component組件，當然這是一個非常正常的操作，我是vue3遷移到nuxt3, nuxt3不是號稱強大兼容性嗎，我如果要改大量代碼才能遷移，那我還用個屁的nuxt3啊！

但是靈感為什么是靈感！ 那是因為你第一直覺在告訴你正確的方向在哪里！

因為找問題的本質是： 找到跟正常對象相比較所不同的地方！

因為這種不同的地方往往不起眼，微不可察，但是就是往往這一點點差異造成了問題！

果然，我此時的直覺告訴我：把這個手動引入組件去掉試試！

然后去掉手動引入組件以后，onMounted鉤子終于執(zhí)行了！

換句話說： 正是因為手動引入組件，導致了vue3生命周期鉤子onMounted不執(zhí)行!

事實上不僅是onMounted不執(zhí)行，而是vue3所有的生命周期鉤子都不能執(zhí)行！

為什么會這樣：我突然想起nuxt3設計時就是不需要開發(fā)者手動導入組件的，直接使用組件名就可以用了。

但是沒有想到：如果手動引入組件，會產生如此嚴重的后果！

那我只能說nuxt3框架的兼容性真的太垃圾了！作為vue3遷移nuxt3, 大家都只想盡量少改代碼，誰會想到要修改組件引入方式。而且nuxt3的規(guī)矩太多了，跟vue3根本就是兩樣東西，新的條條框框一大堆，寫的又不清楚，你很難知道所有規(guī)則，要不是為了ssr服務端渲染，鬼才用nuxt3!

好了，我寫完了，你應該感謝你有運氣看到這篇文章，否則你可能這輩子都解決不了這個問題。