微信小程序開發(fā)環(huán)境準(zhǔn)備
完成帳戶注冊后,需要登錄微信公共平臺官網(wǎng)(mp.weixin.qq.com),根據(jù)流程完善小程序信息,如圖1-5所示。需要注意的是,目前小程序名稱一旦確定后便不能修改。

開發(fā)小程序之前還需要進入“用戶身份-開發(fā)者”,綁定開發(fā)者,如圖1-6所示。只有綁定的開發(fā)者才能使用開發(fā)者工具編寫小程序,一個小程序最多可以綁定20個開發(fā)者,未認(rèn)證的小程序最多可以綁定10個開發(fā)者。

添加開發(fā)者后,需要要進入“設(shè)置-開發(fā)設(shè)置”,獲取ApplD,如圖1-7所示。AppID十分重要,只有填寫了ApplD的項目才能通過手機微信掃碼進行真機測試。

最后便可到首頁下載開發(fā)者工具,如圖1-8所示。小程序開發(fā)工具主要用于小程序調(diào)試、預(yù)覽,雖然自帶了代碼編輯功能,但還是建議使用自己熟悉的編輯器對代碼進行編輯(如: sublime、atom.brackets等)。

1.3第一個小程序
完成開發(fā)準(zhǔn)備后我們便可以開始編寫小程序,微信小程序的開發(fā)十分簡單,大家可以快速上手。下面我們利用官方提供的dmeo讓大家對小程序開發(fā)有初步認(rèn)識。
1)打開微信開發(fā)者工具。第一次啟動需要掃描二維碼登錄,如圖1-9所示,開發(fā)權(quán)限配置參照上—小節(jié)。

2)登錄后選擇“添加項目”。
3)在填寫項目信息之前,先創(chuàng)建一個空目錄作為項目資源目錄,這里我們以E: lweixinldemo為例。
4)填寫項目信息。如果沒有ApplD可以選擇“無AppID";填寫項目名稱,項目名稱在微信開發(fā)者工具中是唯一的;項目目錄選擇剛才創(chuàng)建的空目錄,這里一定要保證剛才創(chuàng)建的目錄為空目錄,這樣下
面會出現(xiàn)“在當(dāng)前目錄中創(chuàng)建quick start項目”選項,勾選這個選項,如圖1-10所示,然后點擊“添加項目”按鈕。

創(chuàng)建好后的界面如圖1-11所示。

這樣我們便成功創(chuàng)建了第一個小程序,這個demo是官方提供的示例,第一個頁面展示了當(dāng)前登錄的用戶信息,點擊頭像會跳轉(zhuǎn)到一個記錄當(dāng)前小程序啟動時間的日志頁面。為了讓大家進一步體驗小程序開發(fā),我們利用Sublime或其他編輯工具打開E: lweixinldemo文件夾,修改index.wxml,將“t{motto}}”替換為“我的第一個小程序”,index.wxml修改后代碼如下:
<!--index.wxml-->
<view class="container">
<view bindtap="bindViewTap" class="userinfo">
<image class="userinfo-avatar" src=""{userInfo.avatarUrl}}"background-size= "cover"><limage>
<text class="userinfo-nickname">fuserInfo.nickName}/</text></view>
<view class="usermotto"><!--修改這句代碼-->
<text class="user-motto">我的第一個小程序</text></view>
</view>

重啟后,登錄界面提示語由原來的“Hello World”變成了“我的第一個小程序”,如圖1-13所示。
填寫了ApplD的項目可以選擇“項目→預(yù)覽”(如圖1-14所示),掃描二維碼在微信中體驗項目。

至此我們簡單體驗了一個小程序的創(chuàng)建過程,但對于一個喜歡“刨根問底”的學(xué)習(xí)者來說,這個案例遠遠不夠,可能會有很多問題,例如:
-小程序啟動入口在哪里?
-index.wxml、index.wxss、index.js等文件是否可以重新命名?它們之間的關(guān)系是什么?目錄結(jié)構(gòu)有怎樣的規(guī)范?
-WXML、WXSS文件是什么?怎么感覺很像HTML和CSS?-小程序開發(fā)中有哪些限制?
大家可以先按自己理解嘗試修改項目中相關(guān)的文件,看看能產(chǎn)生什么效果,把過程中遇到的問題記錄下來,帶著問題閱讀后面的章節(jié)。
小結(jié)
本章簡單介紹了小程序開發(fā)流程,讓大家對小程序有體驗式理解。小程序的學(xué)習(xí)過程并不難,掌握框架、組件、API后可快速上手,技術(shù)細(xì)節(jié)問題我們將在后續(xù)章節(jié)中進行詳細(xì)講解。本章僅介紹了主要的流程,接入過程中碰到的細(xì)節(jié)問題可參考官方資料: http:/lmp.weixin.qq.com/debug/wxadoclintroduction。
您當(dāng)前瀏覽的文章:《微信小程序開發(fā)環(huán)境準(zhǔn)備》由小程序開發(fā)服務(wù)品牌九尾狐整理發(fā)布。
轉(zhuǎn)載請注明:http://www.jytsl.com.cn/shows/6/25.html
文章標(biāo)簽:


