h5 頁面适配iphone6等手機

出現問題

項目中，有些需要給移動端做的h5頁面。開發的時間預覽使用的是浏覽器自帶的移動端模拟功能，各種樣式，功能都是沒有問題的。開發完成之後，使用自己的手機也閱覽過，也是沒有任何的問題。但是當傳遞測試的時間，在iphone6以下的機型中測試的時間出現了樣式亂的問題。

思考問題

h5頁面使用的是vue單模闆，有一個清單在iphone6頁面出現的是直接顯示了标簽，是以考慮到可能是js沒有正确的加載和執行

解決問題

首先想到的就是相容性的問題，iphone6手機可能對一些新的js文法沒有支援性。百度也搜了一下，也有人是let在iphone中不支援，換為var就ok了。是以就考慮更換頁面中的let。更換let之後，部分頁面已經可以正産渲染了。

Babel

有些頁面依舊沒有正常的渲染。考慮到，線上的js轉化工具，類似将es6轉為es5的。結果發現了

Babel 是一個 JavaScript 編譯器

Babel 是一個工具鍊，主要用于将 ECMAScript 2015+ 版本的代碼轉換為向後相容的 JavaScript 文法，以便能夠運作在目前和舊版本的浏覽器或其他環境中。

了解了Babel之後，發現這正是我所需要的。

Babel線上編輯工具

使用bable轉譯之後，所有機型完美渲染。