vue移動端項目兼容ios10以下機型頁面白屏和樣式顯示問題

解決白屏問題

方案:使用es6-promise和babel-polyfill
首先安裝這兩個依賴:

npm install --save-dev es6-promise
npm install --save-dev babel-polyfill

安裝完成後,在項目的main.js文件中添加如下代碼:

import 'babel-polyfill';
import Es6Promise from 'es6-promise'
Es6Promise.polyfill();

解決打包後樣式顯示不出來的問題

方案:更改webpack.prod.conf.js 文件中的css插件的配置,如下圖:註釋掉的是原來的配置,註釋下面的是新的配置。

// new OptimizeCSSPlugin({
//   cssProcessorOptions: config.build.productionSourceMap
//     ? { safe: true, map: { inline: false } }
//     : { safe: true }
// }),
new OptimizeCSSPlugin({
  cssProcessorOptions: {
    safe: true,
    autoprefixer: false,
    discardComments: {
      removerAll: true
    }
  },
  canPrint: true
}),
發佈了3 篇原創文章 · 獲贊 3 · 訪問量 3051
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章