Vue 版本
完整版：同時(shí)包含編譯器和運(yùn)行時(shí)的構(gòu)建。
編譯器：用來(lái)將模板字符串編譯成為 JavaScript 渲染函數(shù)的代碼。
運(yùn)行時(shí)：用來(lái)創(chuàng)建 Vue 實(shí)例，渲染并處理 virtual DOM 等行為的代碼?；旧暇褪浅ゾ幾g器的其他一切。
UMD：UMD 構(gòu)建可以直接通過(guò) <script>
標(biāo)簽用在瀏覽器中。Unpkg CDN 的 https://unpkg.com/vue 默認(rèn)文件就是運(yùn)行時(shí) + 編譯器的 UMD 構(gòu)建 (vue.js
)。CommonJS：CommonJS 構(gòu)建用來(lái)配合老的打包工具比如 browserify 或 webpack 1。這些打包工具的默認(rèn)文件 (pkg.main
) 是只包含運(yùn)行時(shí)的 CommonJS 構(gòu)建 (vue.runtime.common.js
)。ES Module：ES module 構(gòu)建用來(lái)配合現(xiàn)代打包工具比如 webpack 2 或 rollup。這些打包工具的默認(rèn)文件 (pkg.module
) 是只包含運(yùn)行時(shí)的 ES Module 構(gòu)建 (vue.runtime.esm.js
)。
Vue安裝
直接<script>中引入
- 下載使用UMD,直接通過(guò) <script>標(biāo)簽用在瀏覽器中
- 使用CDN 的 https://unpkg.com/vue 默認(rèn)文件就是運(yùn)行時(shí) + 編譯器的 UMD 構(gòu)建 (vue.js)。
NPM
在用 Vue.js 構(gòu)建大型應(yīng)用時(shí)推薦使用 NPM 安裝， NPM 能很好地和諸如 Webpack 或 Browserify 模塊打包器配合使用。
# 最新穩(wěn)定版
$ npm install vue
vue-cli
Vue.js 提供一個(gè)官方命令行工具，可用于快速搭建大型單頁(yè)應(yīng)用。該工具提供開(kāi)箱即用的構(gòu)建工具配置，帶來(lái)現(xiàn)代化的前端開(kāi)發(fā)流程。只需幾分鐘即可創(chuàng)建并啟動(dòng)一個(gè)帶熱重載、保存時(shí)靜態(tài)檢查以及可用于生產(chǎn)環(huán)境的構(gòu)建配置的項(xiàng)目：
# 全局安裝 vue-cli
$ npm install --global vue-cli
# 創(chuàng)建一個(gè)基于 webpack 模板的新項(xiàng)目
$ vue init webpack my-project
# 安裝依賴(lài)，走你
$ cd my-project
$ npm install
$ npm run dev
使用vue-cli時(shí)，當(dāng)使用 vue-loader 或 vueify 的時(shí)候，*.vue 文件內(nèi)部的模板會(huì)在構(gòu)建時(shí)預(yù)編譯成 JavaScript。你在最終打好的包里實(shí)際上是不需要編譯器的，因?yàn)橹皇怯眠\(yùn)行時(shí)構(gòu)建即可。
如果你需要線上編譯模板 (比如傳入一個(gè)字符串的 template 選項(xiàng)，或掛載到一個(gè)元素上并以其內(nèi)部的 HTML 作為模板)，你將需要加上編譯器，即使用完整版的構(gòu)建：
// 需要編譯器
new Vue({
template: '<div>{{ hi }}</div>'
})
// 不需要編譯器
new Vue({
render (h) {
return h('div', this.hi)
}
})
你需要在你的打包工具里配置
