vue項目使用hbuilder打包后，真機測試白屏

在命令行直接運行 npm run build后，生成的dist文件中,直接打開index.html文件

Tip: built files are meant to be served over an HTTP server.
  Opening index.html over file:// won't work.

打包完后，提示只能在服務端可以開啟，file模式下無法工作

問題： 使用vue腳手架開發的spa項目，在打包為app時，出現白屏現象
原因： 想要在手機端打開，等同於在本地file模式下打開，因而需要作出判斷

會出現兩種結果，在pc端

• 打開后白屏；
• 可以打開頁面

處理方案 ：

打開后白屏

1. 原因在於打開需要在服務端，而不是本地打開file模式下。需要修改 webpack中的代碼。根路徑，改為相對路徑

 // config文件夾 ==> index.js  ==>  build 中修改 assetsPublicPath 為相對路徑
 build: {
    // Template for index.html
    index: path.resolve(__dirname, '../dist/index.html'),
    // Paths
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',   修改為'./'  根路徑變為相對路徑

2. vue-router中模式修改為hash 如果是history下,頁面無法顯示圖片等

 // src文件夾 ==> router文件夾 ==> index.js中找到  new Router  
  export default new Router({
  mode: 'history', //修改為hash 或者直接去除
  routes: []

可以打開頁面

在上面兩個都已經解決完后，使用hbuild打包為app后，在手機端依舊打開白屏。此時已經不是模式等問題，而應該考慮其他問題，比如es6語法支持程度等等
3. 因為promise支持程度不是很好，需要使用 babel-polyfill進行支持

    //build文件夾 ==> webpack.base.conf.js中添加

    //下載包后，引入
    require('babel-polyfill')

    //入口文件中 添加
     entry: {
      //為了 es6 的promise
      app: ['babel-polyfill','./src/main.js']  / /  app: './src/main.js' 
    },

經過這些處理，在手機端應該就可以查看了