Vite rollup not working with images

[MarquesCoding]

Hi,

I'm trying to create a library within Vite and have setup some rollup options and was wondering if you could provide some help / suggestions / support on this.

const externalDeps = Object.keys(pkg.dependencies).map(
    (dep) => new RegExp(dep)
);

build: {
    lib: {
      entry: resolve(_dirname, 'src/components/index.ts'),
      name: 'hm-gms-common-library',
      formats: ['es', 'umd', 'cjs'],
      fileName: (format: string) => `bundle.${format}.js`,
    },
    rollupOptions: {
      external: [...externalDeps],
    },
  },

This is my current build config within vite.config.ts and when bundling this, the bundle size is around 1.5MB but if I do this config...

build: {
  lib: {
    entry: resolve(_dirname, 'src/components/index.ts'),
    name: 'hm-gms-common-library',
    formats: ['es', 'umd', 'cjs'],
    fileName: (format: string) => `bundle.${format}.js`,
  },
  rollupOptions: {
    external: ['react', 'react-dom'],
    output: {
      globals: {
        react: 'React',
        'react-dom': 'ReactDOM',
      },
    },
  },
},

My bundle size is around 3MB.

So, I'm having an issue with the bundle size and some of the functionality that I'm doing with my components. When the bundle size is 1.5MB images will not render using const texture = new TextureLoader().load(imagePath); but if the bundle size is 3MB it does render. Looking at the network tab in my browser I see that it's pulling the images correct and there are no errors there, using the React Plugin for debug I see that there are information about the image but it's not rendering....

Hopefully I've added enough information for this.