小程序踩坑筆記

用過了IDE，再看wepyjs，才發現後者的強大。 固然，預覽和調試仍是須要IDE的，因此wepyjs的做用就是提升開發效率。

1、使用PostCSS

前段時間wepy尚未正式支持postcss，但相關插件已經在開發了，經過查看源碼編譯成功。須注意：

• 包cssnext早已廢棄，現使用postcss-cssnext，用法不變。
• style的lang屬性必須指定爲postcss，以便編譯腳本能正確識別。
• 使用cssnano會致使編譯失敗，可以使用postcss-csso等插件代替。

postcss的其它插件也能照常使用，能夠替代sass。

2、使用vue的語法檢查

wepy「借鑑了Vue.js的語法風格和功能特性」，但提供的standard模板卻使用低標準的html語法檢測規則，建議採用vue的recommended標準，以保障更好的代碼質量。須注意：

• 務必替換eslintrc的plugins的值爲['vue']。
• wepy畢竟不是vue，有些規則並不適用，好比v-on的modifier，不妨直接關閉。
• indent檢測不太好使，若是你的縮進習慣比較好，能夠關閉。

這樣操做以後，能夠經過在package.json的script部分添加eslint --fix --ext .js,.wpy src來自動修復並格式化代碼，效率不降反升。

3、自定義組件有重大缺陷

wepy 1.7版本的自定義組件，在循環渲染（甚至用到多個實例）時，實際上只渲染一次，致使數據綁定及事件響應失效。

其中，經過repeat元素建立的會綁定初次渲染的數據和事件，而block建立的則綁定最後一次申明的事件，數據未能綁定。但有一個例外，即className均被正確傳遞了！

這是已知的bug，而2.x版本還不可用，所以涉及到多重實例的狀況，建議經過view+class+tap的方式在page內單獨實現。