Vue兩個版本的區(qū)別和使用方法(更深層次了解)
在我們使用 vue時,我們可以引用兩個不同版本的 Vue,分別是 Vue完整版(vue.js)和 Vue(vue.runtime.js )非完整版,那么它們的區(qū)別是什么呢,今天我們就來分析下這兩個不同版本之間的區(qū)別。
1、文件名
2、文件大小
完整版:同時包含編譯器和運行時的版本。
編譯器:用來將模板字符串編譯成為 JavaScript 渲染函數(shù)的代碼。
而非完整版不包含編譯器,體積約比完整版小 30%。
3、視圖
完整版
視圖寫在 HTML里或者 template選項里,由于有 compiler(編譯器)的存在,完整版運行時:用來創(chuàng)建 Vue 實例、渲染并處理虛擬 DOM 等的代碼?;旧暇褪浅ゾ幾g器的其它一切。
非完整版
完整版運行時:當使用 vue-loader 或 vueify 的時候,*.vue 文件內(nèi)部的模板會在構建時預編譯成 JavaScript。你在最終打好的包里實際上是不需要編譯器的,所以只用運行時版本即可。
// 不需要編譯器 new Vue({ render (h) { return h('div', this.hi) } }) // 需要編譯器 new Vue({ template: '<div>{{ hi }}</div>' })
4、配置
從 webpack 引入,完整版需要配置 alias,非完整版 是默認配置;
從 @vue/cli 引入,完整版需要額外配置,非完整版 是默認配置。
總結
既然這兩者有這么多不同,那我們平時用哪個版本呢?
當然是用非完整版了,理由如下:
1.保證用戶體驗,用戶下載的JS文件體積更小,但只支持h函數(shù)
2.保證開發(fā)體驗,開發(fā)者可直接在vue文件里寫HTML標簽,而不寫 h函數(shù)
3.活讓loader做,vue-loader 會把vue文件里的HTML轉為h函數(shù),這樣我不用寫太多麻煩的 h函數(shù)就可做到和完整版一樣的事,還更節(jié)約文件大小,提升用戶體驗。
以上所述是小編給大家介紹的Vue兩個版本的區(qū)別和使用方法(更深層次了解),希望對大家有所幫助!
相關文章
安裝vue3開發(fā)者工具但控制臺沒有顯示出vue選項的解決
這篇文章主要介紹了安裝vue3開發(fā)者工具但控制臺沒有顯示出vue選項的解決方案,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-10-10Vue路由組件的緩存keep-alive和include屬性的具體使用
:瀏覽器頁面在進行切換時,原有的路由組件會被銷毀,通過緩存可以保存被切換的路由組件,本文主要介紹了Vue路由組件的緩存keep-alive和include屬性的具體使用,感興趣的可以了解一下2023-11-11Vue使用extend動態(tài)創(chuàng)建組件的實現(xiàn)
本文主要介紹了Vue使用extend動態(tài)創(chuàng)建組件的實現(xiàn),文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2023-04-04Vue el-table表頭上引入組件不能實時傳參解決方法分析
這篇文章主要介紹了Vue el-table表頭上引入組件不能實時傳參解決方法,總的來說這并不是一道難題,那為什么要拿出這道題介紹?拿出這道題真正想要傳達的是解題的思路,以及不斷優(yōu)化探尋最優(yōu)解的過程。希望通過這道題能給你帶來一種解題優(yōu)化的思路2022-11-11