Skip larger chunks to run "Npm run build"

Question

I encountered this problem while trying to run "npm run build"

(!) Some blocks are larger than 500 KiB after minification. Please consider:
- Use dynamic import() to code split your application
- Use build.rollupOptions.output.manualChunks to improve chunk splitting: https://rollupjs.org/guide/en/#outputmanualchunks
- Adjust the chunk size limit for this warning via build.chunkSizeWarningLimit. 

Answer 1

EDIT: Here is a workaround, just hide the warning

Add command in vite.config.js

build: {
    chunkSizeWarningLimit: 1600,
  },

Complete code

// https://vitejs.dev/config/
export default defineConfig({
  base: "/Stakepool-Frontend/",
  plugins: [vue()],
  resolve: {
    alias: {
      "~": path.resolve(__dirname, "node_modules"),
      "@": path.resolve(__dirname, "src"),
    },
  },
  build: {
    chunkSizeWarningLimit: 1600,
  },
});

Answer 2

If you don't want to increase chunkSizeWarningLimit and are more concerned with solving the actual size problem, try the following solutions:

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