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]>

Author: freddyaboulton

.changeset/slick-ducks-fry.md

@@ -0,0 +1,6 @@
+---
+"@gradio/preview": patch
+"gradio": patch
+---
+
+fix:Fix custom components on windows

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):

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 || [];

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`;