就在上周，突然很多用戶反饋，都說小小簽到布局亂掉了（線上有四款小程序都收到這樣的反饋，這里我就不廣告了），經過客服反復溝通，找到了布局亂掉的必現條件：

1、IOS用戶較多，系統版本為8.X，很難升級(iPhone 5 & 5S)；

2、部分頁面布局亂掉，這些頁面都用到了flex布局（反復排查之后，懷疑跟flex布局有關系）；

3、之前使用正常，小程序新發布后就亂掉了；

4、最近發布過新代碼；

先看個截圖：

巧的是，微信web開發工具也在前不久從0.X版本升級到了1.X版本，整個UI改動比較大，這里不細說~

出現這么嚴重的問題，那肯定是先回滾代碼，回滾后用戶那邊就顯示正常了，說明肯定是代碼的問題。

對比代碼之后，發現新代碼中主要是添加了一些CSS3的動畫。難道是CSS3某些動畫不支持？索性就把動畫代碼全部去掉，用5S測試機運行一下，依然亂碼。

然后把flex布局修改成float實現，發現布局正常，但是工作量太大，之前的代碼中多列布局，全部用的flex實現。所以，繼續查找問題~

兩次代碼基本一樣，但提交后效果卻不一樣，為什么？我開始懷疑是開發工具的問題了，因為開發工具從0.x突然升級到了1.X，整個改動很大，難道是提交的時候，代碼壓縮的方式不對？或者我發布代碼的姿勢不對？

最終發現了問題，確實是開發工具里面壓縮代碼時，默認勾選項目發生了變化，默認情況下“上傳代碼時樣式自動補全”并未選中，如下：

勾選這個選項后，再次發布代碼，布局就正常了。

然后我又去網上查了一下flex布局在ios 8.x上不兼容的處理，大部分回復都是說要添加前綴：

display:-webkit-box;

display:-webkit-flex;

display:-ms-flexbox;

dispiay:flex;

之前用flex布局，是因為文本寬度會根據內容多少而發生變化，這一點兒讓人特別不爽~

順便再說一個另一個同學提的問題：為什么獲取手機號getPhoneNumber(OBJECT)API調用報錯？

凡是遇到這種問題，首先是看小程序官方文檔，如果還解決不了，就去社區上查找~

社區上已經有官方人員回復了，獲取手機號功能，不對個人開發者開放，并且前端沒辦法直接拿到手機號，需要到服務端去解密。