前端技術(shù)規(guī)劃書
一、項(xiàng)目定位
1. 簡(jiǎn)介
項(xiàng)目擬名:【熱搜】———— 你看到的,就是熱搜(項(xiàng)目廣告詞,擬用于新聞加載空白頁(yè))
2. 需求
新聞?wù)故绢怉pp 1.0版(高仿今日頭條手機(jī)端)
新聞分類、搜索以及實(shí)時(shí)更新、展示
用戶注冊(cè)、登陸、評(píng)論、點(diǎn)贊、收藏、分享、訂閱、設(shè)置
二、UI框架
1. 界面構(gòu)建
主推 【Mint UI】,備用【YDUI Touch】【Vue Carbon】【Vonic】
要與Vue 2.0 搭配使用,可嵌入組件
2. 鏈接
不選最好的,只選最合適的!
Vonic
Mint UI
Vue Carbon
YDUI Touch
三、主流前端框架
1. 前端框架
基于Vue.js 2.0,全面使用HTML5
單頁(yè)面SPA應(yīng)用,包含webpack模塊打包器,css預(yù)處理SASS或是LESS,按需加載,Vuex狀態(tài)管理
結(jié)合組件化、axios或者vue-resource(官網(wǎng)已不推薦)、vue-loader、vue-cli腳手架
2. 構(gòu)建步驟
2.1 安裝vue-cli,配置vue命令環(huán)境
npm install vue-cli -g
vue --version
vue list
2.2 初始化項(xiàng)目,生成項(xiàng)目模板
語(yǔ)法:vue init 模板名 項(xiàng)目名
2.3 進(jìn)入生成的項(xiàng)目目錄,安裝模塊包
cd 項(xiàng)目名
npm install
2.4 運(yùn)行
npm run dev //啟動(dòng)測(cè)試服務(wù)
npm run build //將項(xiàng)目打包輸出dist目錄,項(xiàng)目上線的話要將dist目錄拷貝到服務(wù)器上
3. 開發(fā)測(cè)試
手機(jī)實(shí)時(shí)跟測(cè)(二維碼(QR碼)生成器)
四、項(xiàng)目打包
基于當(dāng)前開發(fā)1.0版不大量使用手機(jī)端原生功能,可以不顧慮只在實(shí)際開發(fā)中發(fā)現(xiàn)并解決問(wèn)題
hbuilder或是appcan打包,Cordova