vue3.0以上关于打包后出现空白页和路由不起作用

1.解决页面空白，找不到资源

在项目根目录中的vue.config.js中publicPath: '/'修改为publicPath: './',如果没有这个文件，新建一个，基础代码为：

module.exports = {
  publicPath: './',
    outputDir: 'dist',
    lintOnSave: true,
    runtimeCompiler: true, //关键点在这
    // 调整内部的 webpack 配置。
    // 查阅 https://github.com/vuejs/vue-doc-zh-cn/vue-cli/webpack.md
    chainWebpack: () => {},
    configureWebpack: () => {},
    // 配置 webpack-dev-server 行为。
    devServer: {
      open: process.platform === 'darwin',
      host: '0.0.0.0',
      port: 8080,
      https: false,
      hotOnly: false,
      // 查阅 https://github.com/vuejs/vue-doc-zh-cn/vue-cli/cli-service.md#配置代理
      proxy: null, // string | Object
      before: app => {}
    }
  }

2.解决路由不起作用：

将路由中的红框里面的注释掉，或者将history模式更改为vue项目默认的hash模式即可