Vue3】vite打包报错:块的大小超过限制,Some chunks are larger than 500kb after minification

简介: Vue3】vite打包报错:块的大小超过限制,Some chunks are larger than 500kb after minification

Vue3】vite打包报错:块的大小超过限制,Some chunks are larger than 500kb after minification

image.png

解决

1、加大限制的大小将500kb改成1000kb或者更大:

chunkSizeWarningLimit:1500

2、分解块,将大块分解成更小的块,在vite.config.js当中的build下面进行配置

rollupOptions: {
   
   
        output:{
   
   
            manualChunks(id) {
   
   
              if (id.includes('node_modules')) {
   
   
                  return id.toString().split('node_modules/')[1].split('/')[0].toString();
              }
          }
        }
    }

完整

在vite.config.ts里添加如下代码

build: {
   
   
    chunkSizeWarningLimit: 1500,
    rollupOptions: {
   
   
      output: {
   
   
        manualChunks(id) {
   
   
          if (id.includes('node_modules')) {
   
   
            return id.toString().split('node_modules/')[1].split('/')[0].toString();
          }
        }
      }
    }
  },

参考
Vue3】vite打包报错:块的大小超过限制,Some chunks are larger than 500kb after minification

目录
相关文章
|
1天前
|
移动开发 前端开发
ruoyi-nbcio-plus基于vue3的flowable为了适配文件上传改造VForm3的代码记录
ruoyi-nbcio-plus基于vue3的flowable为了适配文件上传改造VForm3的代码记录
|
1天前
|
JavaScript 前端开发
vue2升级到vue3的一些使用注意事项记录(四)
vue2升级到vue3的一些使用注意事项记录(四)
|
1天前
|
移动开发 前端开发
ruoyi-nbcio-plus基于vue3的flowable收回任务后重新进行提交表单的处理
ruoyi-nbcio-plus基于vue3的flowable收回任务后重新进行提交表单的处理
|
1天前
|
移动开发 前端开发
ruoyi-nbcio-plus基于vue3的flowable多租户机制
ruoyi-nbcio-plus基于vue3的flowable多租户机制
|
1天前
|
移动开发 前端开发
ruoyi-nbcio-plus基于vue3的flowable的消息中心我的消息的升级修改
ruoyi-nbcio-plus基于vue3的flowable的消息中心我的消息的升级修改
|
缓存 资源调度 前端开发
用webpack4带你实现一个vue的打包的项目
一个用webpack4打包的vue 的项目,参照vue-cli的webpack配置,一步一步带你实现一个vue的打包的项目,每一个commit对应一个步骤。
2939 0
|
1天前
|
JavaScript
vue打印v-model 的值
vue打印v-model 的值
|
1天前
|
JavaScript
vue知识点
vue知识点
4 1
|
2天前
|
JavaScript
Vue实战-组件通信
Vue实战-组件通信
4 0
|
2天前
|
JavaScript
Vue实战-将通用组件注册为全局组件
Vue实战-将通用组件注册为全局组件
5 0