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;
}
相关推荐
漫天转悠9 分钟前
VScode中配置ESlint+Prettier详细步骤(图文详情)
vscode·vue
落魄实习生13 小时前
AI应用-本地模型实现AI生成PPT(简易版)
python·ai·vue·ppt
bpmf_fff15 小时前
二九(vue2-05)、父子通信v-model、sync、ref、¥nextTick、自定义指令、具名插槽、作用域插槽、综合案例 - 商品列表
vue
java_heartLake21 小时前
Vue3之状态管理Vuex
vue·vuex·前端状态管理
小马超会养兔子21 小时前
如何写一个数字老虎机滚轮
开发语言·前端·javascript·vue
小阳生煎1 天前
多个Echart遍历生成 / 词图云
vue
小马超会养兔子2 天前
如何写一个转盘
开发语言·前端·vue
bpmf_fff2 天前
二八(vue2-04)、scoped、data函数、父子通信、props校验、非父子通信(EventBus、provide&inject)、v-model进阶
vue
好开心333 天前
04、Vue与Ajax
前端·ajax·前端框架·vue·js
工业互联网专业3 天前
Python毕业设计选题:基于Python的社区爱心养老管理系统设计与实现_django
python·django·vue·毕业设计·源码·课程设计