栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 系统运维 > 运维 > Linux

vue3打包后打开页面部分空白如何解决?

Linux 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

vue3打包后打开页面部分空白如何解决?

我个人的原因是router的history模式引起的。

做以下几点,问题解决。

1.修改vue.config.js

const { defineConfig } = require('@vue/cli-service')
//const path = require("path");
//const resolve = function(dir) {
//  return path.join(__dirname, dir);
//};
module.exports = defineConfig({
  publicPath: process.env.NODE_ENV === 'production' ? './' : '/',
  outputDir: 'dist',
  indexPath: 'index.html',
  transpileDependencies: true,
  lintOnSave:false, //每次保存都启用eslint
  
  devServer: {
    port:8000
  }
})

2.修改router/index.js

import { createWebHistory, createRouter } from 'vue-router';

const history = createWebHistory("/");//这里加了"/"不知道是不是有效果 没测
const router=createRouter({
    history,
    routes})

3.最主要是这步,nginx修改配置

location / {
            index index.php index.html error/index.html;
			try_files $uri $uri/ /index.html;
}

重启nginx,好了

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/893681.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号