diff --git a/.chronus/changes/fix-swagger-ui-build-2024-3-1-18-48-1.md b/.chronus/changes/fix-swagger-ui-build-2024-3-1-18-48-1.md
new file mode 100644
index 000000000..f1073d0f7
--- /dev/null
+++ b/.chronus/changes/fix-swagger-ui-build-2024-3-1-18-48-1.md
@@ -0,0 +1,6 @@
+---
+changeKind: internal
+packages:
+  - "@typespec/playground"
+---
+
diff --git a/packages/playground/rollup.config.ts b/packages/playground/rollup.config.ts
index dfc8c72bb..bf1e6457c 100644
--- a/packages/playground/rollup.config.ts
+++ b/packages/playground/rollup.config.ts
@@ -12,6 +12,7 @@ const packageJson = JSON.parse(readFileSync(resolve(__dirname, "package.json")).
 const dependencies = Object.keys(packageJson.dependencies);
 const external = [
   ...dependencies,
+  "swagger-ui-dist/swagger-ui-es-bundle.js",
   "swagger-ui-dist/swagger-ui.css",
   "@typespec/bundler/vite",
   "react-dom/client",
diff --git a/packages/playground/src/react/viewers/react-wrapper.tsx b/packages/playground/src/react/viewers/react-wrapper.tsx
index f65283b12..a8683c739 100644
--- a/packages/playground/src/react/viewers/react-wrapper.tsx
+++ b/packages/playground/src/react/viewers/react-wrapper.tsx
@@ -1,5 +1,8 @@
 import { useEffect, useRef } from "react";
-import { SwaggerUIBundle } from "swagger-ui-dist";
+// File exists but not describe in the @types package
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
+// @ts-ignore
+import SwaggerUIBundle from "swagger-ui-dist/swagger-ui-es-bundle.js";
 
 export default (props: { spec: string }) => {
   const uiRef = useRef(null);