之前開發(fā)項APP項目直接用APICloud+原生js的方式進行編寫，整個項目下來發(fā)現(xiàn)開發(fā)慢，頁面代碼多且復雜，維護起來相對困難，而且文件大打包之后的APP會比較大，apicloud的框架也不好用，支持部分es67(像let、const、import等es6新特性不支持寫的太難受了)

創(chuàng)新互聯(lián)2013年至今，是專業(yè)互聯(lián)網(wǎng)技術(shù)服務公司，擁有項目網(wǎng)站設計制作、成都網(wǎng)站設計網(wǎng)站策劃，項目實施與項目整合能力。我們以讓每一個夢想脫穎而出為使命，1280元博野做網(wǎng)站,已為上家服務,為博野各地企業(yè)和個人服務,聯(lián)系電話:028-86922220

采用vue-cli+APIcloud的方式寫解決以上痛點，開發(fā)靈活，并且打包之后體積更小速度更快

環(huán)境依賴

• vue
• webpack
• vue-cli3
• nodeJS

基本流程

項目開發(fā)最好準備兩個項目，一個打包APP，一個項目開發(fā)，也會減少很多不必要的麻煩

創(chuàng)建項目并初始化

cd到項目想要創(chuàng)建的位置，執(zhí)行：

vue create vue-for-apicloud

選擇Manually select features

根據(jù)自己需求選擇模塊（不要Router,因為vue-router跳轉(zhuǎn)頁面的效果相比window和frame相比差太多了），按空格鍵選中，按回車完成選擇：

選擇css預處理器語言，選擇之后可以獲得預處理語言支持：

選擇eslint：

剩下的配置根據(jù)自己情況來設定，等待項目創(chuàng)建完成。

項目結(jié)構(gòu)

項目結(jié)構(gòu)如圖：

多頁面配置

項目根目錄下創(chuàng)建vue.config.js

const pages = require('./build/pages')
module.exports = {
 publicPath: './',
 pages: pages,
 // 是否生成sourceMap文件
 // 開發(fā)環(huán)境配置true，方便快速定位錯誤（APICloud控制臺輸出真的很難受）
 // 生產(chǎn)環(huán)境配置false，構(gòu)建速度更快，打包之后體積更小
 productionSourceMap: true
}

分享名稱：基于vue-cli3多頁面開發(fā)apicloud應用的教程詳解第1/2頁-創(chuàng)新互聯(lián)
瀏覽路徑：http://weahome.cn/article/cdeces.html