vue和vuejs區別(vue.js和vue.runtime.js對比有什么區別)

在我們使用 vue時,我們可以引用兩個不同版本的 Vue,分別是 Vue完整版(vue.js)和 Vue(vue.runtime.js )非完整版,那么它們的區別是什么呢,今天我們就來分析下這兩個不同版本之間的區別。

1、文件名

2、文件大小

完整版:同時包含編譯器和運行時的版本。

編譯器:用來將模板字符串編譯成為 JavaScript 渲染函數的代碼。

而非完整版不包含編譯器,體積約比完整版小 30%。

3、視圖

完整版

視圖寫在 HTML里或者 template選項里,由于有 compiler(編譯器)的存在,完整版運行時:用來創建 Vue 實例、渲染并處理虛擬 DOM 等的代碼?；旧暇褪浅ゾ幾g器的其它一切。

非完整版

完整版運行時:當使用 vue-loader 或 vueify 的時候,*.vue 文件內部的模板會在構建時預編譯成 JavaScript。你在最終打好的包里實際上是不需要編譯器的,所以只用運行時版本即可。

//不需要編譯器newVue({render(h){returnh('p',this.hi)}})//需要編譯器newVue({template:'<p>{{hi}}</p>'})

4、配置

從 webpack 引入,完整版需要配置 alias,非完整版 是默認配置;

從 @vue/cli 引入,完整版需要額外配置,非完整版 是默認配置。

總結

既然這兩者有這么多不同,那我們平時用哪個版本呢?

當然是用非完整版了,理由如下:

1.保證用戶體驗,用戶下載的JS文件體積更小,但只支持h函數

2.保證開發體驗,開發者可直接在vue文件里寫HTML標簽,而不寫 h函數

3.活讓loader做,vue-loader 會把vue文件里的HTML轉為h函數,這樣我不用寫太多麻煩的 h函數就可做到和完整版一樣的事,還更節約文件大小,提升用戶體驗。

感謝各位的閱讀!關于“vue.js和vue.runtime.js對比有什么區別”這篇文章就分享到這里了,希望以上內容可以對大家有一定的幫助,讓大家可以學到更多知識,如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!