我們將會(huì)選擇使用一些 vue 周邊的庫 vue-cli，vue-router，vue-resource，vuex

　　1. 使用 vue-cli 創(chuàng)建項(xiàng)目

　　2. 使用 vue-router 實(shí)現(xiàn)單頁路由

　　3. 使用 vuex 管理我們的數(shù)據(jù)流

　　4. 使用 vue-resource 請(qǐng)求我們的 node 服務(wù)端

　　5. 使用 .vue 文件進(jìn)行組件化的開發(fā)

?

　　PS：本文 node v6.2.2 npm v3.9.5 vue v2.1.0 vue-router v2.0.3 vuex v2.0.0 最終我們將會(huì)構(gòu)建出一個(gè)小 demo，不廢話，直接上圖。

　　1.我們將會(huì)使用 webpack 去為我們的模塊打包，預(yù)處理，熱加載。如果你對(duì) webpack 不熟悉，它就是可以幫助我們把多個(gè) js 文件打包為 1 個(gè)入口文件，并且可以達(dá)到按需加載。這就意味著，我們不用擔(dān)心由于使用太多的組件，導(dǎo)致了過多的 HTTP 請(qǐng)求，這是非常有益于產(chǎn)品體驗(yàn)的。但我們并不只是為了這個(gè)而使用 webpack，我們需要用 webpack 去編譯.vue 文件，如果沒有使用一個(gè) loader 去轉(zhuǎn)換我們.vue 文件里的 style、js 和 html，那么瀏覽器就無法識(shí)別。

　　2.模塊熱加載是 webpack 的一個(gè)非常碉堡的特性，將會(huì)為我們的單頁應(yīng)用帶來極大的便利。

　　通常來說，當(dāng)我們修改了代碼刷新頁面，那應(yīng)用里的所有狀態(tài)就都沒有了。這對(duì)于開發(fā)一個(gè)單頁應(yīng)用來說是非常痛苦的，因?yàn)樾枰匦略谂芤槐榱鞒?。如果有模塊熱加載，當(dāng)你修改了代碼，你的代碼會(huì)直接修改，頁面并不會(huì)刷新，所以狀態(tài)也會(huì)被保留。
?