Vue.js介紹

是一個用於建立使用者介面的開源JavaScript框架，也是一個建立單頁應用的Web應用框架。2016年一項針對JavaScript的調查表明，Vue有著89%的開發者滿意度。在GitHub上，該專案平均每天能收穫95顆星，為Github有史以來星標數第3多的專案。
它提供了很多有用的功能來達到漸進增強的策略。與其他的框架不同的是，你可以把Vue和既有的HTML做整合，這讓你可以像使用插入性替換的函式庫一樣來使用Vue，就像使用JQuery一樣。

除此之外，也可以使用Vue寫一個單頁式應用程式。用Vue來建構網頁，當處理較複雜的應用時有較好的開發效率及體驗。 Vue也有提供函式庫來做客戶端路由及狀態管理。Vue對客戶端路由及狀態管理這些工具採取中間立場的態度，雖然 Vue的核心團隊推薦使用這些函式庫，但是這些函式庫沒有直接打包進Vue，而是讓你可以自由選擇使用其他更適合你的應用的路由庫或狀態管理庫。

除了可以漸進地把Vue整合到應用程式裡，Vue也提供了漸進式的方法來撰寫網頁內容。就像大部分的框架，Vue讓你創造可以重複使用的網頁內容區塊。大部分時候，Vue元件是用一種特殊的HTML樣板語法寫成的，然而在一些場景使用HTML語法會有限制時，可以使用JSX或是Javascript函式來定義你的元件。

安裝

如果要在既有的專案中使用Vue，可以把以下任一個script標籤加到你的頁面中，這樣你就可以開始在專案中使用Vue ，這也是為什麼Vue宣稱自己是一個漸進式的框架。它提供了一個很好的機會，你可以把一些使用函式庫，像是JQuery 的專案轉變成使用Vue ，如此一來，就可以使用很多Vue的核心功能，像是屬性、客製化元件以及資料管理。

• 開發環境版本

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

• 產品環境版本

<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>

然而，以上方法有一些限制。若要建置一些較複雜的應用程式，需要使用 Vue NPM 套件。 這讓你可以使用 Vue 的進階功能且可以使用打包器像是 WebPack。為了讓使用Vue建置應用程式變得更容易，可以使用CLI來精簡化開發流程。如果要使用 npm 套件 & CLI ，將需要：

1. 安裝 Node.js 8.11+
2. npm 或 yarn

在終端機執行以下命令來安裝 CLI ：

npm install --global @vue/cli

比較喜歡使用 yarn 的話：

yarn global add @vue/cli

安裝完 CLI 後，在你想要創建專案的資料夾內開啟終端機然後執行 vue create 來初始化專案。 CLI 將會給你一連串專案組態，有些設定有預設值，而你可以更改成你自己的設定。這些選項讓你可以在專案裡配置 TypeScript 、 linting 、 vue-router 、 Testing 等等。