fix cdn build (#6191)

* fix cdn build * add changeset --------- Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com>
gradio-app · Oct 31, 2023 · b555bc0 · b555bc0
1 parent 141afe1
commit b555bc0
Show file tree

Hide file tree

Showing 5 changed files with 47 additions and 31 deletions.
diff --git a/.changeset/moody-rooms-sleep.md b/.changeset/moody-rooms-sleep.md
@@ -0,0 +1,7 @@
+---
+"@gradio/app": patch
+"@gradio/preview": patch
+"gradio": patch
+---
+
+fix:fix cdn build
diff --git a/js/app/build_plugins.ts b/js/app/build_plugins.ts
@@ -32,26 +32,22 @@ export function patch_dynamic_import({
 		name: "patch-dynamic-import",
 		enforce: "post",
 		writeBundle(config, bundle) {
-			if (mode !== "cdn") return;
-
-			const import_re = /import\(((?:'|")[\.\/a-zA-Z0-9]*(?:'|"))\)/g;
-			const import_meta = `${"import"}.${"meta"}.${"url"}`;
-
-			for (const file in bundle) {
-				const chunk = bundle[file];
-				if (chunk.type === "chunk") {
-					if (chunk.code.indexOf("import(") > -1) {
-						const fix_fn = `const VERSION_RE = new RegExp("${gradio_version}\/", "g");function import_fix(mod, base) {const url =  new URL(mod, base); return import(\`${cdn_url}\${url.pathname?.startsWith('/') ? url.pathname.substring(1).replace(VERSION_RE, "") : url.pathname.replace(VERSION_RE, "")}\`);}`;
-						chunk.code =
-							fix_fn +
-							chunk.code.replace(import_re, `import_fix($1, ${import_meta})`);
-
-						if (!config.dir) break;
-						const output_location = join(config.dir, chunk.fileName);
-						writeFileSync(output_location, chunk.code);
-					}
-				}
-			}
+			// const import_re = /import\(((?:'|")[\.\/a-zA-Z0-9]*(?:'|"))\)/g;
+			// const import_meta = `${"import"}.${"meta"}.${"url"}`;
+			// for (const file in bundle) {
+			// 	const chunk = bundle[file];
+			// 	if (chunk.type === "chunk") {
+			// 		if (chunk.code.indexOf("import(") > -1) {
+			// 			const fix_fn = `const VERSION_RE = new RegExp("${gradio_version}\/", "g");function import_fix(mod, base) {const url =  new URL(mod, base); return import(\`${cdn_url}\${url.pathname?.startsWith('/') ? url.pathname.substring(1).replace(VERSION_RE, "") : url.pathname.replace(VERSION_RE, "")}\`);}`;
+			// 			chunk.code =
+			// 				fix_fn +
+			// 				chunk.code.replace(import_re, `import_fix($1, ${import_meta})`);
+			// 			if (!config.dir) break;
+			// 			const output_location = join(config.dir, chunk.fileName);
+			// 			writeFileSync(output_location, chunk.code);
+			// 		}
+			// 	}
+			// }
 		}
 	};
 }

diff --git a/js/app/vite.config.ts b/js/app/vite.config.ts
@@ -36,11 +36,11 @@ import {
 	resolve_svelte
 } from "./build_plugins";
 
-const GRADIO_VERSION = process.env.GRADIO_VERSION || "asd_stub_asd";
+const GRADIO_VERSION = version || "asd_stub_asd";
 const TEST_CDN = !!process.env.TEST_CDN;
 const CDN = TEST_CDN
 	? "http://localhost:4321/"
-	: `https://gradio.s3-us-west-2.amazonaws.com/${GRADIO_VERSION}/`;
+	: `https://gradio.s3-us-west-2.amazonaws.com/${version_raw}/`;
 const TEST_MODE = process.env.TEST_MODE || "jsdom";
 
 //@ts-ignore

diff --git a/js/preview/rollup.config.js b/js/preview/rollup.config.js
@@ -18,6 +18,7 @@ const vite_client = require.resolve("vite/dist/client/client.mjs");
 const hmr = require.resolve("svelte-hmr");
 
 const output_svelte_dir = "../../gradio/templates/frontend/assets/svelte";
+const output_svelte_dir_cdn = "../../gradio/templates/cdn/assets/svelte";
 
 const onwarn = (warning, warn) => {
 	if (warning.plugin === "typescript") return;
@@ -152,20 +153,32 @@ export default [
 	},
 	{
 		input: "src/svelte-submodules.ts",
-		output: {
-			file: join(output_svelte_dir, "svelte-submodules.js"),
-			format: "esm"
-		},
+		output: [
+			{
+				file: join(output_svelte_dir, "svelte-submodules.js"),
+				format: "esm"
+			},
+			{
+				file: join(output_svelte_dir_cdn, "svelte-submodules.js"),
+				format: "esm"
+			}
+		],
 		onwarn,
 		plugins
 	},
 
 	{
 		input: "src/svelte-internal.ts",
-		output: {
-			file: join(output_svelte_dir, "svelte.js"),
-			format: "esm"
-		},
+		output: [
+			{
+				file: join(output_svelte_dir, "svelte.js"),
+				format: "esm"
+			},
+			{
+				file: join(output_svelte_dir_cdn, "svelte.js"),
+				format: "esm"
+			}
+		],
 		onwarn,
 		plugins
 	},

diff --git a/package.json b/package.json
@@ -6,7 +6,7 @@
 		"dev": "pnpm css && pnpm --filter @gradio/client build && pnpm --filter @gradio/preview build && pnpm --filter @gradio/app dev",
 		"css": "pnpm --filter @gradio/theme generate",
 		"build": "pnpm css && pnpm --filter @gradio/client build && pnpm --filter @gradio/app build:local --emptyOutDir && pnpm --filter @gradio/preview build",
-		"build:cdn": "pnpm --filter @gradio/client build && pnpm --filter @gradio/app build:cdn --emptyOutDir",
+		"build:cdn": "pnpm --filter @gradio/client build && pnpm --filter @gradio/app build:cdn --emptyOutDir && pnpm --filter @gradio/preview build",
 		"build:website": "pnpm --filter @gradio/app build:website --emptyOutDir",
 		"build:cdn-local": "TEST_CDN=TRUE pnpm build:cdn",
 		"preview:cdn-server": "sirv ./gradio/templates/cdn --single --port=4321 --cors",