1.查看Router文件设置路由模式

const router = new VueRouter({
  mode: 'hash',
  // mode: 'history', //history模式打包后需要后端帮你指定服务器的项目路径
  // base: process.env.BASE_URL,
  routes
})

2.设置vue.config.js

const path = require("path");
const resolve = function(dir) {
  return path.join(__dirname, dir);
};
module.exports = {
  publicPath: process.env.NODE_ENV === "production" ? "./" : "./",
  outputDir: "dist",
  assetsDir: "static",
  lintOnSave: true, // 是否开启eslint保存检测
  productionSourceMap: false, // 是否在构建生产包时生成sourcdeMap
  chainWebpack: config => {
    config.resolve.alias
      .set("@", resolve("src"))
      .set("@v", resolve("src/views"))
      .set("@c", resolve("src/components"))
      .set("@u", resolve("src/utils"))
    config.optimization.runtimeChunk("single");
  },
  devServer: {
    // host: "localhost",
    /* 本地ip地址 */
    //host: "192.168.1.107",
    host: "0.0.0.0", //局域网和本地访问
    port: "8080",
    hot: true,
    /* 自动打开浏览器 */
    open: false,
    overlay: {
      warning: false,
      error: true
    },
    /* 跨域代理 */
    // proxy: {
    //   "/api": {
    //     /* 目标代理服务器地址 */
    //     target: "http://m260048y71.zicp.vip", //
    //     // target: "http://192.168.1.102:8888", //
    //     /* 允许跨域 */
    //     changeOrigin: true,
    //     ws: true,
    //     pathRewrite: {
    //       "^/api": ""
    //     }
    //   }
    // }
  }
};

3.采用Nginx服务在浏览器中打开，其中nginx.conf 的serve配置说明

 server {
        listen   8085;  
        server_name  localhost;
        autoindex on;
        index index.html index.htm index.php;
        #charset koi8-r;

        access_log  logs/access.log;
        root E:/loongPro/well-erp/dist;

        # 接口在同个电脑运行
        #location = /api {
        #    rewrite ^/api/(.*)$ /$1 break;
        #    proxy_pass http://localhost:9966;
        #}

        location = /favicon.ico {
            log_not_found off;
            access_log off;
        }
}

参考文献：https://blog.csdn.net/progrmmmm/article/details/120728057