vue打包发布到服务器出现空白页问题

vue打包发布的时候，经常出现的问题，就是进去是空白的，时而报错，时而不报错

1， vue2.0项目中config文件下index.js中打包配置 // vue3.0+项目中无config文件，在根目录下创建vue.config…js中打包配置

module.exports = {
  publicPath: './', // 根域上下文目录
  outputDir: 'dist', // 构建输出目录
  assetsDir: 'static', // 静态资源目录 (js, css, img, fonts)
  lintOnSave: false, // 是否开启eslint保存检测，有效值：ture | false | 'error'
  runtimeCompiler: true, // 运行时版本是否需要编译
  transpileDependencies: [], // 默认babel-loader忽略mode_modules，这里可增加例外的依赖包名
  productionSourceMap: true, // 是否在构建生产包时生成 sourceMap 文件，false将提高构建速度
  devServer: {
    open: true,
    host: 'localhost',
    port: 8080,
    // https: false,
    // hotOnly: false,
    proxy: {
      // 配置跨域
      '/api': {
        target: 'http://192.168.111.245:9090/',
        ws: true,
        changOrigin: true,
        pathRewrite: {
          '^/api': ''
        }
      }
    }
  }
}

特别注意， 若是vue-cli3.0版本y以上则是publicPath: “./”, // 根域上下文目录 若是vue-cli3.0版本以下则是 baseURL："./"

2，路由配置：router文件夹下index.js

import Vue from 'vue';
import Router from 'vue-router';
import Home from '@/components/Home';
Vue.use(Router);

export default new Router({
  // mode: 'history',
  base: process.env.BASE_URL,
  routes: [
    {
      path: '/',
      name: 'Home',
      component: Home
    },

    {
      path: '/morning',
      name: 'morning',
      component: () => import('../views/morning.vue')
    },
    {
      path: '/afternoon',
      name: 'afternoon',
      component: () => import('../views/afternoon.vue')
    },
    {
      path: '/total',
      name: 'total',
      component: () => import('../views/total.vue')
    }
  ]
});

注意，系统默认是mode：是history，我们只需要把这里注释即可