vue3+vite+vue-router4 使用history 页面打开白屏问题

最新推荐文章于 2024-05-19 14:53:37 发布

Bonne_nuit_

最新推荐文章于 2024-05-19 14:53:37 发布

阅读量1.2k

点赞数 1

分类专栏：前端文章标签： vue.js 前端 vue

本文链接：https://blog.csdn.net/qq_43237014/article/details/128567839

版权

前端专栏收录该内容

6 篇文章 1 订阅

订阅专栏

1.首先在Vue router的index中加入base，

import {
  createRouter,
  createWebHashHistory,
  createWebHistory,
} from "vue-router";
import routes from "./routes";
import Cookies from "js-cookie";
//base 直接加在 createWebHistory 中
const routerHistory = createWebHistory('/ceshi/');
const router = createRouter({
  history: routerHistory,
  routes,
});

2.在vite.config.js 中设置 base，以及build之后的文件目录

base: "/ceshi/", // 类似publicPath，'./'避免打包访问后空白页面，要加上，不然线上也访问不了
 build: {
    chunkSizeWarningLimit: 1000,
    outDir: "dist",
    assetsDir: "assets", //指定静态资源存放路径
    // assetsPublicPath:'',
    sourcemap: true, //是否构建source map 文件
    terserOptions: {
      // 生产环境移除console
      compress: {
        drop_console: true,
        drop_debugger: true,
      },
    },