vue全家桶實現一個小商城

vue全家桶實現一個小的移動商城

學習了一段時間的react,臨近過年了。想到年後要換工做,就想把以前的vue再看看,畢竟如今版本迭代快。正好又遇上vue-cli 3.0 beta的到來,就順便上手試試吧。完成一個移動小商城的demo,是個新手項目。

倉庫地址

在線預覽 手機掃描二維碼或在電腦上打開瀏覽器調試手機模式

二維碼

  • 首先是全局安裝
npm install -g @vue/cli
// 或
yarn global add @vue/cli
  • 而後生成項目之後能夠發現,目錄結構變簡單了。build和config目錄都沒有了,vue-cli依舊使用webpack打包工具只是默認配置好了。只剩下vue-config.js當你須要更改默認配置纔會用的到,實際開發者我並無使用到。
  • 開發過程當中大部分人都會使用模板、樣式預處理。這些也只要安裝相應的依賴。我是使用pug和sass,安裝對應的模板依賴包,打包工具默認已安裝幾乎全部的loader,因此直接用就好了。

項目預覽

項目預覽

項目預覽

項目總結

  • 如今靜態資源(以前老版本腳手架的static目錄)都放在public下。
  • http請求依舊使用axios模擬請求本地數據,輪播圖和彈框使用mint-ui。
  • 購物車數據使用vuex進行管理
  • 一個新手項目但願對你所幫助

最後給個小星星支持下吧

相關文章
相關標籤/搜索