描述 | UMD | CommonJS | ES Module |
---|---|---|---|
完整版 | vue.js | vue.common.js | vue.esm.js |
只包含運行時版 | vue.runtime.js | vue.runtime.common.js | vue.runtime.esm.js |
完整版 (生產環境) | vue.min.js | - | - |
只包含運行時版 | (生產環境) | vue.runtime.min.js | - |
術語
完整版:同時包含編譯器和運行時的版本。
編譯器:用來將模板字符串編譯成爲 JavaScript 渲染函數的代碼。
運行時:用來創建 Vue 實例、渲染並處理虛擬 DOM 等的代碼。基本上就是除去編譯器的其它一切。
UMD:UMD 版本可以通過 <script>
標籤直接用在瀏覽器中。jsDelivr CDN 的 https://cdn.jsdelivr.net/npm/vue
默認文件就是運行時 + 編譯器的 UMD 版本 (vue.js)。
CommonJS:CommonJS 版本用來配合老的打包工具比如 Browserify 或 webpack 1。這些打包工具的默認文件 (pkg.main) 是隻包含運行時的 CommonJS 版本 (vue.runtime.common.js)。
ES Module:ES module 版本用來配合現代打包工具比如 webpack 2 或 Rollup。這些打包工具的默認文件 (pkg.module) 是隻包含運行時的 ES Module 版本 (vue.runtime.esm.js)。
重點:
如果你需要在客戶端編譯模板 (比如傳入一個字符串給 template 選項,或掛載到一個元素上並以其 DOM 內部的 HTML 作爲模板),就將需要加上編譯器
通俗來說,就是runtime版本是無法對template進行解析的