aboutsummaryrefslogtreecommitdiff
path: root/playground/src/App.svelte
diff options
context:
space:
mode:
authornetop://ウィビ <paul@webb.page>2026-04-24 16:50:12 -0700
committernetop://ウィビ <paul@webb.page>2026-04-24 16:50:12 -0700
commit216441d3564e00aabfac7e8acf346e34a5db9598 (patch)
tree67cfc8ccac0df117f098d8fa0569000ed8274a20 /playground/src/App.svelte
parent85c05927989c712015ee82cea9b2917485a3f0e8 (diff)
downloadgraphiql-216441d3564e00aabfac7e8acf346e34a5db9598.tar.gz
graphiql-216441d3564e00aabfac7e8acf346e34a5db9598.zip
Add Vite playground for local development
npm run dev boots a Vite + Svelte 5 server at localhost:5173, importing GraphiQL.svelte directly from source/library. HMR reflects changes without a package rebuild. Points at the public Countries API by default — swap playground/src/App.svelte for your own endpoint.
Diffstat (limited to 'playground/src/App.svelte')
-rw-r--r--playground/src/App.svelte23
1 files changed, 23 insertions, 0 deletions
diff --git a/playground/src/App.svelte b/playground/src/App.svelte
new file mode 100644
index 0000000..82a8c9d
--- /dev/null
+++ b/playground/src/App.svelte
@@ -0,0 +1,23 @@
+<script lang="ts">
+ /*** IMPORT ------------------------------------------- ***/
+
+ import { createHttpFetcher } from "../../source/library/index.ts";
+ import GraphiQL from "../../source/library/GraphiQL.svelte";
+
+ /*** UTILITY ------------------------------------------ ***/
+
+ const fetcher = createHttpFetcher({
+ url: "https://countries.trevorblades.com/"
+ });
+
+ const initialQuery = `query Countries {
+ countries {
+ code
+ name
+ emoji
+ }
+}
+`;
+</script>
+
+<GraphiQL {fetcher} {initialQuery}/>