Disable code splitting (chunks) in Vue.js + Vite.js

Question

How I can disable chunking in Vue.js + Vite.js using Rollup.js on building project?

I tried like this but doesn't work for me:

export default defineConfig({
    build: {
        rollupOptions: {
            output: {
                manualChunks: {}
            }
        }
    }
})

Answer 1

This works for me (for React, I think it should also work for Vue):

import { defineConfig } from 'vite' // 2.8.0
import react from '@vitejs/plugin-react' // 1.0.7

export default defineConfig ({
  plugins: [react()],
  build: {
    rollupOptions: {
      output: {
        manualChunks: {}
      },
    },
  },
})

Answer 2

It seems to be that Rollup has option (output.inlineDynamicImports) that:

This will inline dynamic imports instead of creating new chunks to create a single bundle. Only possible if a single input is provided

import { fileURLToPath, URL } from 'node:url'

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    vue(),
  ],
  resolve: {
    alias: {
      '@': fileURLToPath(new URL('./src', import.meta.url))
    }
  },
  build: {
    rollupOptions: {
      output: {
        inlineDynamicImports: true
      },
    },
  },
})