Fix custom components on windows (#8531)

* Fix usability windows * Add config.js * Add code * revert pnpm.lock' * add changeset --------- Co-authored-by: gradio-pr-bot <[email protected]>
gradio-app · Jun 13, 2024 · 88de38e · 88de38e
1 parent a4433be
commit 88de38e
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 5 deletions.
diff --git a/.changeset/slick-ducks-fry.md b/.changeset/slick-ducks-fry.md
@@ -0,0 +1,6 @@
+---
+"@gradio/preview": patch
+"gradio": patch
+---
+
+fix:Fix custom components on windows
diff --git a/gradio/cli/commands/components/build.py b/gradio/cli/commands/components/build.py
@@ -64,7 +64,7 @@ def _build(
         package_name = get_deep(pyproject_toml, ["project", "name"])
 
         python_path = _get_executable_path(
-            "python", None, "--python-path", check_3=True
+            "python", python_path, "--python-path", check_3=True
         )
 
         if not isinstance(package_name, str):

diff --git a/js/preview/src/build.ts b/js/preview/src/build.ts
@@ -47,7 +47,9 @@ export async function make_build({
 				comp.frontend_dir &&
 				fs.existsSync(join(comp.frontend_dir, "gradio.config.js"))
 			) {
-				const m = await import(join(comp.frontend_dir, "gradio.config.js"));
+				const m = await import(
+					join("file://" + comp.frontend_dir, "gradio.config.js")
+				);
 
 				component_config.plugins = m.default.plugins || [];
 				component_config.svelte.preprocess = m.default.svelte?.preprocess || [];

diff --git a/js/preview/src/dev.ts b/js/preview/src/dev.ts
@@ -157,7 +157,7 @@ async function generate_imports(
 				fs.existsSync(join(component.frontend_dir, "gradio.config.js"))
 			) {
 				const m = await import(
-					join(component.frontend_dir, "gradio.config.js")
+					join("file://" + component.frontend_dir, "gradio.config.js")
 				);
 
 				component_config.plugins = m.default.plugins || [];
@@ -184,13 +184,13 @@ async function generate_imports(
 			);
 
 		const example = exports.example
-			? `example: () => import("${to_posix(
+			? `example: () => import("/@fs/${to_posix(
 					join(component.frontend_dir, exports.example)
 				)}"),\n`
 			: "";
 		return `${acc}"${component.component_class_id}": {
 			${example}
-			component: () => import("${to_posix(
+			component: () => import("/@fs/${to_posix(
 				join(component.frontend_dir, exports.component)
 			)}")
 			},\n`;