一、寫在前面
據說vue 2.5已經發布了，更好的集成了Ts(TypeScript), 然并卵。。。，反正我是從vue2.0開始折騰的，這篇文章不是一個教程,只是作為一個Web beginner 給自己的折騰增加點樂趣。。，一直寫代碼會很煩躁，與其坐在電腦前2B一樣的寫代碼，還邊寫邊吐槽自己寫的東西，不如寫個bug讓大家一起吐槽。。。
項目設計圖
頁面相當簡單哈， 登錄頁，首頁，詳情頁。。
二、準備工作
項目直接用的vue 官方的腳手架工具初始化的。所以機器上事先安裝了node,和webpack（至于這倆玩意兒怎么安裝請自行百度。。。。），順著官方的提示一直往下擼,執行‘npm run dev’后，瀏覽器會自動打開初始化的項目，生成一個相當low的samble, low 不low看圖就知道了。。
打開你的IDE，我這邊用的是VS(Virtual Studio), 咱們還是先來看一下demo的目錄結構
目錄有很多，其實也不比驚方（慌）, 我們的代碼主要是在src目錄（當然這個目錄你可以自行創建，然后在config 目錄下的webpack.base.config進行相應的配置，不過這種費力不討好的事情咱們就不折騰了）。OK, 搞清楚一個大概之后，我們就可以在這個事例項目中搞事情了。對 src目錄進行開刀。。
三、開始碼代碼了
對官方的demo 進行小手術之后，src 目錄結構如下圖
因為我自己的這個項目的頁面結構相當簡單，一個公共的頭部Header, 內容頁公共的組件（components 目錄）按時間篩選結果（Filter）, 篩選結果列表（List）,篩選結果匯總（Statistic），然后5個頁面（pages, 請大家忽略Auth.vue, 這是鄙人犯傻搞出來，后來想想當時這么做是相當蠢的）。本篇處置化項目就寫到這里，太長大家看的也犯困，犯累。。我后面會一個一個頁面，一個一個組件慢慢寫，這讓大家吐槽點就更多一點，不能在一篇文章里把槽點全吐完了。。。
