此次項目需要兼容 andriod 4.4 ，ios 8 . 故此帶來了不少兼容問題

1. vue 項目在本地表現正常，打包後出現部分樣式丟失。

如果只是小範圍的影響，可以用以下註釋跳過 webpack 對 css 的壓縮計算

/*! autoprefixer: off */
    -webkit-box-orient: vertical;
 /* autoprefixer: on */

大範圍的樣式更改，可以直接修改 / build / webpack.prod.conf.js 文件（相關文章）

    // new OptimizeCSSPlugin({
    //   cssProcessorOptions: config.build.productionSourceMap
 

    //     ? { safe: true, map: { inline: false } }
    //     : { safe: true }
    // }),

為了自動補全css前綴，配置 autoprefixer ，在package.json裏面找到 browserslist ，加上

"browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8",
    "iOS >= 8",
    "Android >= 4.4",
    "Firefox >= 20"
  ]

"iOS >= 8","Firefox >= 20","Android > 4.4"

2. vant vant-swipe （有贊）

有贊的輪播插件在低版本安卓機中，樣式錯亂疊堆

原因可能是輪播組件的高度追溯父容器的 height ，而父容器不能固定一個高度，以 height : 100vh ; 替代，但是低版本安卓不兼容，高度錯亂，只要在 vue 的 mounted 鉤子中重新定義 父容器高度即可

// html

// js
mounted(){
    
 
this.$nextTick(function(){
      let h = $(window).height()
      this.viewHeight = h
    })
  }

健康養生 （flex 兼容寫法在打包後丟失、安卓4.4顯示錯誤）