diff --git a/public/app/index.ts b/public/app/index.ts
index d50ecb988a1..3d56b45b880 100644
--- a/public/app/index.ts
+++ b/public/app/index.ts
@@ -1,5 +1,6 @@
 import 'vite/modulepreload-polyfill';
 import './core/trustedTypePolicies';
+import './jquery';
 
 // TODO: Vite should have __wepack_public_path support. Not looked into it yet.
 // declare let __webpack_public_path__: string;
diff --git a/public/app/jquery.ts b/public/app/jquery.ts
new file mode 100644
index 00000000000..cd6ca71f7e7
--- /dev/null
+++ b/public/app/jquery.ts
@@ -0,0 +1,3 @@
+// Vite: hacky approach to making jQuery globally available
+import jQuery from 'jquery';
+Object.assign(window, { $: jQuery, jQuery });
diff --git a/vite.config.ts b/vite.config.ts
index 59acae86edc..388874b2a57 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -24,8 +24,8 @@ export default defineConfig({
   },
   plugins: [react(), angularHtmlImport()],
   optimizeDeps: {
-    // fix for $ is not a function
-    exclude: ['jquery'],
+    // fixes for dependencies that don't support esm
+    include: ['jquery'],
   },
   resolve: {
     alias: [