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;
}
相关推荐
狼性书生3 小时前
uniapp实现的Tab 选项卡组件模板
前端·uni-app·vue·组件·插件
水月wwww10 小时前
vue学习之组件与标签
前端·javascript·vue.js·学习·vue
星光一影11 小时前
基于SpringBoot智慧社区系统/乡村振兴系统/大数据与人工智能平台
大数据·spring boot·后端·mysql·elasticsearch·vue
IT教程资源C1 天前
(N_151)基于微信小程序校园学生活动管理平台
mysql·vue·前后端分离·校园活动小程序·springboot校园活动
AI3D_WebEngineer2 天前
企业级业务平台项目设计、架构、业务全解之组件库篇
前端·javascript·vue
木子李BLOG2 天前
vue.js设计与实现(待续)
vue
悟能不能悟2 天前
reason: unable to verify the first certificate 如何处理
vue
!win !3 天前
通过重写组件轻松掌握用JSX写Vue项目
vue·jsx
zy happy4 天前
RuoyiApp 在vuex,state存储nickname vue2
前端·javascript·小程序·uni-app·vue·ruoyi
小阳生煎4 天前
Vue实现全局设置一个刷新按钮 只刷新当面路由页面 不跳转操作功能
vue.js·vue