Vite in Laravel 9 seems to break a javascript file on `npm run build`

I created this post on StackOverflow and the Vite Discord but also posting here. I'm probably doing something wrong, but I don't know what.

I am trying to use @yaireo/tagify in my Laravel 9 project. (Link removed as I cannot post links)

I imported it with npm i @yaireo/tagify --save

Then put import Tagify from '@yaireo/tagify' in my app.js file, then ran npm run build on my project.

I can verify the code gets added to the project as it appears in my previously empty app.abc123.js file by looking at the sources within Chrome. The file looks compressed / optimized which I expect to happen.

However, I get this error in the console jquery-3.6.1.min.js:2 Uncaught ReferenceError: Tagify is not defined

I've also tried copying the jQuery.tagify.min.js file to /resources/js/jQuery.tagify.min.js and then using @vite(['resources/js/jQuery.tagify.min.js']) within the blade template, then npm run build to build the files. Again this works, and the file is included in the sources, but the exact same error.

The only way I were able to get it to work without the error was by copying jQuery.tagify.min.js directly to /public/build/assets/jQuery.tagify.min.js and using <script type="text/javascript" src="/build/assets/jQuery.tagify.min.js"></script> in the blade template. Also referencing the CDN files directly works fine.

This says to me that vite seems to be doing something when it's trying to compress/optimise the file that breaks the functionality.

I recall running into the same issues with bootstrap and JQuery and ultimately decided to reference the CDN for those files.

I'd post the pastebin links to be the before / after npm run build but I'm blocked from posting links.