小程序開發(fā)第三彈: uni-app 框架基礎(chǔ)

發(fā)表時間：2021-1-5

發(fā)布人：葵宇科技

瀏覽次數(shù)：49

uni-app 介紹

uni-app 是一個使用 Vue.js 核心庫開發(fā)的前端小程序框架 ; 個人更喜歡這樣認(rèn)為 ; 其實(shí)他還可以編譯原生App 和 H5 應(yīng)用 ; 真正的實(shí)現(xiàn)了一套代碼編譯多端 ;

為什么選擇它uni-app 上面說的很明確

Vue.js 語法 ; Vue 相關(guān)業(yè)務(wù)開發(fā)者基本無痛學(xué)習(xí)
編譯多端 ; 比較方便 ( 當(dāng)然也有坑的地方, 但是對比小程序原生開發(fā)體驗(yàn)還是好太多, 個人認(rèn)為 )

快速上手

工具下載

開發(fā) uni-app 應(yīng)用 , 建議大家都下載他們官方指定的工具 HBuilder 下載地址建議大家安裝 「正式版-App開發(fā)版」 雖然比較大 , 但是功能也比較齊全 ;

創(chuàng)建項(xiàng)目

創(chuàng)建項(xiàng)目有兩種方式 , 這里推薦大家去官網(wǎng)看一下使用 IDE 是怎么創(chuàng)建的 ;

不推薦大家按照官網(wǎng)的意思創(chuàng)建 uni-ui 項(xiàng)目 ( 這個里面模板太多, 不適合剛開始學(xué)習(xí) , 如果大家想看看也行 ) ; 建議默認(rèn)模板 ;
老規(guī)矩 , 云開發(fā)暫時不選 , 這個功能后面可以在看
項(xiàng)目目錄大概以下這樣 ; 這樣創(chuàng)建的項(xiàng)目會漏掉一些主要分區(qū)比如 store components 這些 ; 后面會做補(bǔ)充 ;

+---pages // 頁面
|   \---index
|           index.vue
|
\---static // 靜態(tài)文件
|       logo.png
|
|   App.vue // 主組件
|   main.js // 入口文件
|   manifest.json // 小程序, App, H5 配置
|   pages.json // 小程序配置文件 類比微信小程序中的 app.json
|   uni.scss // 工程中全局樣式文件 可以放一些通用的樣式變量 mixin 等
復(fù)制代碼

附一張人家官網(wǎng)的完成目錄, 后面爭取全部都加上示例 ;