前言
微信小程序的開(kāi)發(fā)，我應(yīng)該算是趕上了第一波，所以，自然是一路踩坑而來(lái) =。=
一月九日，小程序正式上線，早早地就到公司開(kāi)始改bugs~
前不久，我又對(duì)這個(gè)項(xiàng)目重構(gòu)了一版~
現(xiàn)在來(lái)做個(gè)項(xiàng)目總結(jié)剛好，就給我踩過(guò)的那些坑留點(diǎn)紀(jì)念吧~

開(kāi)發(fā)時(shí),切忌將小程序簡(jiǎn)單地想象成我們web開(kāi)發(fā)中的css、js、html，否則···

微信小程序的開(kāi)發(fā)，實(shí)際上是在微信封裝下對(duì)項(xiàng)目的二次開(kāi)發(fā)了。很多很多的規(guī)則我們必須要去遵守，其中很明顯的就是標(biāo)簽元素。很多標(biāo)簽會(huì)讓我們很自然地和html中的標(biāo)簽元素對(duì)應(yīng)起來(lái)，建立這種對(duì)應(yīng)關(guān)系確實(shí)能夠幫助我們更快地入手小程序，但是一定要記得不要把它們等同起來(lái)，謹(jǐn)記它們是有區(qū)別的。還有，開(kāi)發(fā)之前，記得看看官網(wǎng)文檔上的Q&A，預(yù)熱下。

注：
1.以下標(biāo)題是按照微信開(kāi)發(fā)工具上的選項(xiàng)進(jìn)行劃分的。
2.總結(jié)還在一步步地完善中，每天一點(diǎn)點(diǎn)~
3.歡迎留言指正錯(cuò)誤，知識(shí)共享~

項(xiàng)目
1.開(kāi)發(fā)環(huán)境不校驗(yàn)請(qǐng)求域名以及TSL版本
小程序有嚴(yán)格的域名檢查規(guī)則，規(guī)定使用https。
所以，當(dāng)你的開(kāi)發(fā)環(huán)境是http時(shí)，記得將這個(gè)選項(xiàng)勾上，不然你是無(wú)法請(qǐng)求到接口數(shù)據(jù)的。

2.開(kāi)啟ES6轉(zhuǎn)ES5如果有用ES6語(yǔ)法的話，記得勾上。

編輯
編輯，也就是開(kāi)發(fā)咯。

1.文件引用
在小程序中，它引入了模塊機(jī)制，我們可以在頁(yè)面中引入我們需要的模塊，但是，這種引入是單向的。比如：
a文件：

var b = require('../libs/b.js')

那我們?cè)赽文件中如果這樣：

var a = require('../libs/a.js')

開(kāi)發(fā)者工具是會(huì)報(bào)錯(cuò)的，目前我的解決方案也只是避免這種引用，直接將自己需要的部分放在同一個(gè)文件中。

2.圖片
1）通過(guò)background屬性引用圖片
沒(méi)錯(cuò)，我們可以在開(kāi)發(fā)工具上看到效果挺正常的，但是，打開(kāi)手機(jī)測(cè)試，Ops，圖片不見(jiàn)了。
在官方文檔上有明確規(guī)定，本地資源是無(wú)法通過(guò)css獲取的。
所以，當(dāng)你決定用background-image屬性的時(shí)候，你可以：
a=> 使用網(wǎng)絡(luò)圖片
b=> base64

2）通過(guò)image標(biāo)簽src屬性引用圖片這種方式的引用沒(méi)有資源來(lái)源方式的限制，可以引用本地資源。

調(diào)試
調(diào)試的時(shí)候最大的感悟是，無(wú)論是開(kāi)發(fā)者工具上，還是手機(jī)上，記得先把緩存刪干凈再測(cè)。而且出現(xiàn)bugs的時(shí)候盡量多測(cè)幾次，進(jìn)行反復(fù)確定。不然的話，你可能會(huì)發(fā)現(xiàn)，本來(lái)測(cè)好的功能又出現(xiàn)問(wèn)題了，或者是本來(lái)有問(wèn)題的部分又沒(méi)有問(wèn)題了，所以，測(cè)吧測(cè)吧，多測(cè)幾次。

1.頁(yè)面加載，前端向后臺(tái)發(fā)送數(shù)據(jù)請(qǐng)求。在開(kāi)發(fā)階段，我們?cè)谶M(jìn)行對(duì)請(qǐng)求結(jié)果的業(yè)務(wù)處理時(shí)，自然是邊調(diào)試邊修改的，有時(shí)候我們會(huì)遇到：statusCode沒(méi)處理好而導(dǎo)致前端不斷向后臺(tái)發(fā)送請(qǐng)求，然后，卡機(jī)了。當(dāng)然，在微信開(kāi)發(fā)者工具上，也是。不過(guò)，除此之外，它還會(huì)產(chǎn)生另外一個(gè)副作用，就是可能連小程序本身API上的請(qǐng)求都請(qǐng)求不了了。發(fā)生這種情況的話，你就喝喝茶，做做眼保健操吧，給它點(diǎn)時(shí)間，它會(huì)好起來(lái)的。

2.代碼上傳報(bào)錯(cuò)。
手機(jī)預(yù)覽小程序。在預(yù)覽之前，我們是需要在開(kāi)發(fā)者工具上上傳代碼的，說(shuō)說(shuō)我遇到的報(bào)錯(cuò)把：
1）明確提示我的代碼中哪一個(gè)文件有錯(cuò)誤
這個(gè)比較好辦，就是直接找到對(duì)應(yīng)文件，結(jié)合控制臺(tái)，改好之后再上傳代碼。
2）錯(cuò)誤提示一個(gè)不知道什么原因的error
遇見(jiàn)這種情況，我的解決方案是：不用糾結(jié)，關(guān)掉我的開(kāi)發(fā)者工具，打開(kāi)，再上傳。貌似有點(diǎn)無(wú)厘頭，但是成功幾率很高，不信你可以試試。

其他
1.開(kāi)發(fā)過(guò)程中，記得時(shí)刻關(guān)注官方文檔上的更新日志，保持自己的開(kāi)發(fā)工具是最新的。這是避免跳坑的一大法寶，不過(guò)現(xiàn)在還好了，剛開(kāi)始的時(shí)候是真坑~
2.學(xué)會(huì)在開(kāi)發(fā)者社區(qū)上找答案，沒(méi)有答案就去提問(wèn)，會(huì)有人回答你的。