Vue.js 2.0 安裝

兼容性

Vue.js 不支持 IE8 及其以下版本，因?yàn)?Vue.js 使用了 IE8 不能模擬的 ECMAScript 5 特性。但它支持所有兼容 ECMAScript 5 的瀏覽器。

更新日志

最新穩(wěn)定版本：2.6.14

每個(gè)版本的更新日志見(jiàn) GitHub。

Vue Devtools

在使用 Vue 時(shí)，我們推薦在你的瀏覽器上安裝 Vue Devtools。它允許你在一個(gè)更友好的界面中審查和調(diào)試 Vue 應(yīng)用。

直接用 <script> 引入

直接下載并用 <script> 標(biāo)簽引入，Vue 會(huì)被注冊(cè)為一個(gè)全局變量。

重要提示：在開(kāi)發(fā)時(shí)請(qǐng)用開(kāi)發(fā)版本，遇到常見(jiàn)錯(cuò)誤它會(huì)給出友好的警告。

注意：開(kāi)發(fā)環(huán)境不要用最小壓縮版，不然就失去了錯(cuò)誤提示和警告！

• 開(kāi)發(fā)版本：包含完整的警告和調(diào)試模式
  
• 生產(chǎn)版本：刪除了警告，23.55kb min+gzip

CDN

推薦：unpkg, 會(huì)保持和 npm 發(fā)布的最新的版本一致?？梢栽?nbsp;unpkg.com/vue/ 瀏覽 npm 包資源。

也可以從 jsdelivr 或 cdnjs 獲取，不過(guò)這兩個(gè)服務(wù)版本更新可能略滯后。

NPM

在用 Vue.js 構(gòu)建大型應(yīng)用時(shí)推薦使用 NPM 安裝， NPM 能很好地和諸如 Webpack 或 Browserify 模塊打包器配合使用。 Vue.js 也提供配套工具來(lái)開(kāi)發(fā)單文件組件。

# 最新穩(wěn)定版
$ npm install vue

獨(dú)立構(gòu)建 vs 運(yùn)行時(shí)構(gòu)建

有兩種構(gòu)建方式，獨(dú)立構(gòu)建和運(yùn)行構(gòu)建。它們的區(qū)別在于前者包含模板編譯器而后者不包含。

模板編譯用于編譯 Vue 模板字符串成純 JavaScript 渲染函數(shù)。如果你想用 template 選項(xiàng)，你需要編譯。

模板編譯器的職責(zé)是將模板字符串編譯為純 JavaScript 的渲染函數(shù)。如果你想要在組件中使用 template 選項(xiàng)，你就需要編譯器。

• 獨(dú)立構(gòu)建包含模板編譯器并支持 template 選項(xiàng)。它也依賴(lài)于瀏覽器的接口的存在，所以你不能使用它來(lái)為服務(wù)器端渲染。
• 運(yùn)行時(shí)構(gòu)建不包含模板編譯器，因此不支持 template 選項(xiàng)，只能用 render 選項(xiàng)，但即使使用運(yùn)行時(shí)構(gòu)建，在單文件組件中也依然可以寫(xiě)模板，因?yàn)閱挝募M件的模板會(huì)在構(gòu)建時(shí)預(yù)編譯為 render 函數(shù)。運(yùn)行時(shí)構(gòu)建比獨(dú)立構(gòu)建要輕量30%，只有 16.39 Kb min+gzip大小。

默認(rèn) NPM 包導(dǎo)出的是運(yùn)行時(shí)構(gòu)建。為了使用獨(dú)立構(gòu)建，在 webpack 配置中添加下面的別名：

resolve: {
  alias: {
    'vue$': 'vue/dist/vue.js'
  } 
}

對(duì)于Browserify，可以用 aliasify

不要用 import Vue from 'vue/dist/vue.js' - 用一些工具或第三方庫(kù)引入 Vue ，這可能會(huì)導(dǎo)致應(yīng)用程序在同一時(shí)間加載運(yùn)行時(shí)和獨(dú)立構(gòu)建并造成錯(cuò)誤。

CSP 環(huán)境

有些環(huán)境，如 Google Chrome Apps，強(qiáng)制應(yīng)用內(nèi)容安全策略 (CSP) ，不能使用 new Function() 對(duì)表達(dá)式求值。這時(shí)可以用 CSP 兼容版本。獨(dú)立的構(gòu)建取決于該功能編譯模板，所以無(wú)法使用這些環(huán)境。

另一方面，運(yùn)行時(shí)構(gòu)建的是完全兼容 CSP 的。當(dāng)通過(guò) Webpack + vue-loader 或者 Browserify + vueify 構(gòu)建時(shí)，在 CSP 環(huán)境中模板將被完美預(yù)編譯到 render 函數(shù)中。

命令行工具（CLI）

Vue.js 提供一個(gè)官方命令行工具，可用于快速搭建大型單頁(yè)應(yīng)用。該工具提供開(kāi)箱即用的構(gòu)建工具配置，帶來(lái)現(xiàn)代化的前端開(kāi)發(fā)流程。只需一分鐘即可啟動(dòng)帶熱重載、保存時(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 后，執(zhí)行 vue 命令出錯(cuò)

解決方法：全局搜索 vue.cmd 將 vue.cmd 所在的路徑添加到環(huán)境變量 Path 后面。再執(zhí)行 vue -V 即可。

CLI 默認(rèn)了用戶(hù)對(duì) Node.js 和相關(guān)構(gòu)建工具有一定程度的了解。如果你是新手，我們強(qiáng)烈建議先在不用構(gòu)建工具的情況下通讀本教程，熟悉 Vue 本身之后再研究 CLI。

對(duì)于大陸用戶(hù)，建議將 npm 的注冊(cè)表源設(shè)置為國(guó)內(nèi)的鏡像，可以大幅提升安裝速度。

開(kāi)發(fā)版本

重要：Github 倉(cāng)庫(kù)的 /dist 文件夾只有在新版本發(fā)布時(shí)才會(huì)更新。如果想要使用 Github 上 Vue 最新的源碼，你需要自己構(gòu)建。

git clone https://github.com/vuejs/vue.git node_modules/vue
cd node_modules/vue
npm install
npm run build

Bower

# 最新穩(wěn)定版本
$ bower install vue

AMD 模塊加載器

獨(dú)立下載版本或通過(guò) Bower 安裝的版本已用 UMD 包裝，因此它們可以直接用作 AMD 模塊。