Prevent libraries from being bundled and pull them from cdn instead

I have a react app that I initiated with vite. I wanted to host the app on azure static web apps but apparently I'm exceeding the size limit which is 524288000 bytes.

The biggest contributors seem to be duckdb-wasm and fluentui so I'd like to not bundle those and just have the client get those from their respective CDNs.

Is that doable and if so, how would I do it?

For instance I have in my App.tsx

import * as duckdb from '@duckdb/duckdb-wasm';
import duckdb_wasm_eh from '@duckdb/duckdb-wasm/dist/duckdb-eh.wasm?url';
import eh_worker from '@duckdb/duckdb-wasm/dist/duckdb-browser-eh.worker.js?url';
import { DefaultButton } from '@fluentui/react/lib/Button';
import { Stack, Text, initializeIcons, Pivot, PivotItem, Dropdown} from '@fluentui/react';

How would I replace those? Further, assuming it isn't the same answer, how do I tell the configuration to ignore them?

Edit: this turned out to be a big XY problem. I'll include my details in case it helps anyone else

The issue was that in my yml file I needed to have output_location point to ./dist since that's where vite build puts everything by default. Without that the azure or github action (not sure which) kept all the node_modules which were, of course, too big. With the output_location properly set it deployed just fine.

To load libraries from CDNs instead of bundling them in a Vite project:

1. Add CDN Links in index.html:

<script src="CDN_LINK_FOR_DUCKDB"></script>
<script src="CDN_LINK_FOR_FLUENTUI"></script>

2. Update Vite's Configuration (vite.config.js):

export default {
  build: {
    rollupOptions: {
      external: ['@duckdb/duckdb-wasm', '@fluentui/react'],
    },
  },
  optimizeDeps: {
    exclude: ['@duckdb/duckdb-wasm', '@fluentui/react']
  }
}

3. Reference Global Variables in Your Code:

const DefaultButton = GLOBAL_VAR_FOR_FLUENTUI.DefaultButton;

Replace CDN_LINK_FOR_DUCKDB, CDN_LINK_FOR_FLUENTUI, and GLOBAL_VAR_FOR_FLUENTUI with the appropriate values.