Vue 3升級方法是什么

這篇文章主要講解了“Vue 3升級方法是什么”，文中的講解內容簡單清晰，易于學習與理解，下面請大家跟著小編的思路慢慢深入，一起來研究和學習“Vue 3升級方法是什么”吧！

Vue 3的發布指日可待，我們可以期待一個更快，更小巧，更易于維護的版本，其中包含許多令人興奮的新功能。這些通常是對現有API的補充和改進。

沒有什么可以阻止你使用Vue  3啟動新應用程序的。在本文中，我將向你展示如何領先一步，并通過升級應用程序來開始嘗試新API。如果你對升級后的應用程序感興趣，請看一下我的TodoMVC應用程序，它是用Composition  API編寫的。

TodoMVC：https://github.com/blacksonic/todomvc-vue-composition-api

使用CLI

我強烈建議對Vue項目使用正式的CLI。除了開發和部署工具外，它將升級簡化為單行命令：

vue add vue-next

Vue Next plugin不僅可以升級和安裝新的依賴項，還可以修改代碼以使其與第三版兼容。

依賴

安裝插件會將軟件包 vue、vuex、vue-router、eslint-plugin-vue 和 @vue/test-utils  升級到下一個主要版本。此外，在開發依賴項中還會出現一個名為 @vue/compiler-sfc  的新軟件包。到底有什么好處呢?它將新的Vue單個文件組件編譯為可運行的Javascript代碼。

代碼修改

讓我們來看看代碼中都有哪些變化。首先大家注意到的是，主Vue包中不再有默認的導出。

命名的 export createApp 創建一個新的Vue應用程序，就像Vue 2中的構造函數一樣。插件設置將使用 use  方法(而不是構造函數的參數)移至應用程序實例。$mount 方法會丟失其美元符號，但其行為方式相同。

插件采用了工廠模式：不再使用帶有 new 關鍵字的構造函數。無需調用新的 Vuex.Store，而是需要createStore  工廠方法。不再可能將store的默認導出作為插件傳遞。

路由插件遵循相同的模式：new VueRouter 變成調用 createRouter  ，并且必須保留全局插件設置。在新版本中，你始終必須定義歷史記錄的類型。你可以從 createWebHashHistory，createMemoryHistory  和createWebHistory 中選擇。

基本上就是這樣，可以啟動應用程序并在新的Vue版本上運行。只需一個bash命令即可完成所有操作。其他的東西應該都可以用舊的語法來工作，因為舊的API仍然是完整的。

大小規模

如果檢查build命令的輸出大小，你會注意到略有下降：43.75 KiB-> 40.57  KiB。這是因為將默認Vue實例保留為命名導出的結果。諸如Webpack和Rollup之類的構建工具可以對命名的導出進行tree-shaking(刪除未使用的代碼)，但對默認的導出則不能。

如果沒有CLI

如果沒有CLI，則必須將 vue-loader 或 rollup-plugin-vue 升級到下一個主要版本，并添加 @vue/compiler-sfc  軟件包。這里不再有魔法了，你必須手動完成所有操作。你還必須手動進行代碼修改，這里沒有搜索代碼庫和更新語法的工具。

感謝各位的閱讀，以上就是“Vue 3升級方法是什么”的內容了，經過本文的學習后，相信大家對Vue 3升級方法是什么這一問題有了更深刻的體會，具體使用情況還需要大家實踐驗證。這里是億速云，小編將為大家推送更多相關知識點的文章，歡迎關注！