最近一直在學習Vue,基本的文檔看完后就需要進行具體的項目進行練手了,本系列文章主要是將我學習過程記錄下來,和大家一起學習交流。
我在git上找到了一個淘票票的Vue項目,項目地址:
https://github.com/canfoo/vue2.0-taopiaopiao,大家喜歡的話可以給作者點個fork。
看了下項目的代碼,然后決定自己在山寨一下這個項目,從零開始自己搭建下。
第一步就是開始進行項目的初始化了,這里使用了Vue的腳手架,Vue-cli進行項目的基礎代碼結構搭建。由於使用了vue-cli,需要先全局安裝下vue-cli.
npm install -g vue-cli
安裝完成后就可以進行項目搭建了,找到一個目錄進行項目初始化。
執行:
vue init webpack mytpp

上面的vue-router 是vue頁面的路由管理。ESLink 是對代碼規范性檢查,不符合規范就會報錯,我不太習慣使用,這里選擇no,剩下兩個是單元測試和自動化測試的,我不太了解,暫時也不需要使用,完成后我們便有了項目的基本目錄了。

進入目錄看下項目的結構。

build 和 config目錄下都是項目的基本配置信息,我們的源碼基本都在src下面,這是我們進入mytpp下面,嘗試運行下代碼,執行cnpm isntall (npm install 也可以,如果使用npm install 出一些錯誤,可以嘗試下安裝淘寶鏡像,cnpm , cnpm 和npm 基本的使用都是相同的)。完成后執行
npm run dev
稍等片刻就會在瀏覽器打開一個頁面,

這里說明我們的項目初始化完成了。
本小結結束,下一節我們將繼續進行我們的項目,進行具體代碼的編寫。
注:本文出自博客園 https://home.cnblogs.com/u/mdengcc/ ,轉載請注明出處。
