vite 打包部署出现的问题

1、部文件打包之后大小超过500KiB,错误信息【 Some chunks are larger than 500 KiB after minification.】

将文件块的大小限制改大一些

在vite.config.js中,build里添加或修改 chunkSizeWarningLimit 属性,单位为KiB

bash 复制代码
build: {
      chunkSizeWarningLimit: 1500
    }

2、项目部署之后页面默认跳转至根目录,或者js、css文件获取的路径为根目录

(1)配置base

将vite.config.js中的base属性设置为网页存放的目录

bash 复制代码
 base: '/项目存放目录/'

(2)配置路由的history属性

将router的index.js中的createWebHistory方法添加项目存放的路径

bash 复制代码
const router = createRouter({
  history: createWebHistory("/项目存放目录"),
})

3、项目部署之后页面刷新导致页面404

配置ngnix location / 属性

bash 复制代码
location / {
   alias   /var/www/html/;
   index  index.html index.htm;
   try_files $uri $uri/ /项目存放目录/index.html;
}
相关推荐
super_lzb12 分钟前
VUE 请求代理地址localhost报错[HPM] Error occurred while trying to proxy request
java·spring·vue·springboot·vue报错
phltxy2 小时前
Vue3 + Vite:从入门到实战——核心指令全解析
vue.js·vue
经年未远14 小时前
vue3中实现耳机和扬声器切换方案
javascript·学习·vue
RichardLau_Cx19 小时前
【保姆级实操】MediaPipe SDK/API 前端项目接入指南(Web版,可直接复制代码)
前端·vue·react·webassembly·mediapipe·手部追踪·前端计算机视觉
chao_7891 天前
双设备全栈开发最佳实践[mac系统]
git·python·macos·docker·vue·全栈
码农幻想梦1 天前
Vue3入门到实战【尚硅谷】
前端·vue
吃茄子的猫1 天前
若依框架根据当前登录人信息,显示不同的静态公司logo
前端·vue
千寻技术帮2 天前
10386_基于SpringBoot的外卖点餐管理系统
java·spring boot·vue·外卖点餐
东东5164 天前
xxx医患档案管理系统
java·spring boot·vue·毕业设计·智慧城市
码界奇点4 天前
基于Spring Boot和Vue3的无头内容管理系统设计与实现
java·spring boot·后端·vue·毕业设计·源代码管理