記h5項目中在ios9白屏問題

h5項目在內嵌在app應用中，在ios9白屏，想到的解決方案

1. 使用vconsole（騰訊開發的）一個插件，在手機應用中查看控制檯信息
2. 在ios9的safari瀏覽器中打開一個白屏頁面的連接，查看報錯信息

實際用到的是第二種方式
由於白屏，啥都沒有也就沒有vconsole的按鈕，可是vconsole仍是頗有用的，拿個小本本記下來
複製代碼

1.在safari控制檯發現報錯信息

SyntaxError: Use of const in strict mode.
複製代碼

搜索結果

原來在webpack-dev-server的2.7.0以上版本中，在webpack-dev-server下的client/index.js文件中使用了es6的語法，而咱們在使用babel-loader解析js的時候會將node_modules下的文件exculde，這就致使了報錯！！！ 解決方案

module: {
    rules: [
        {
            test: /.js$/,
            loader: 'babel-loader',
            include:[resolve('src'), resolve('node_modules/webpack_dev_server/client')]
        }
    ]
    
}
複製代碼

在解決了這個問題後，個人h5頁面就能夠正常展現啦，開心 2. 展現的樣式不對，這個主要是position: unset樣式不支持，改爲position: initial

3. 獲取viewport的方式不對

// 這種方式在iso9下並不支持
document.getElementsByTagName('meta').viewport
// 改用
// 1. 在  <meta name='viewport' id='viewport' ...> 添加id爲viewport
// 2. 經過getElementById獲取對象，經過setAttribute設置content內容
document.getElementById('viewport').setAttribute('content', '。。。')
複製代碼

4. vue在ios9系統下，數組在使用for in時，會循環兩遍的問題

// 將for in改爲for循環
for(let i = 0; i < items.length; i++){
    ...
}
複製代碼

以上

在此以前兼容問題不多弄，因此開始時，有些方，致使解決問題用時很長，用小本本記下來，之後按照流程走，不能方，要穩！