- My broken english video
- This video is [email protected]; Now [email protected] is very sample.
Only 2kb size (not gzip)
Easy change Svelte Kit APIs to Zero API.
Use Svelte Kit APIs like call function, support Typescript.
npm install svelte-zero-apiimport preprocess from "svelte-preprocess";
// 1. import
import zeroApiWatch from "svelte-zero-api/watch";
// 2. add watch by change watchPath files, auto create api files:
if (process.env.NODE_ENV !== "production") {
zeroApiWatch();
}
export default {
preprocess: [preprocess({ postcss: true })],
kit: { target: "#svelte" },
};at src/routes/index.svelte
<script lang="ts">
import { zeroApi } from "../zeroApi";
// We can use api before onMount, because api function only run in browser.
// like front end function, and have Typescrit point out.
let helloPost = zeroApi.api.hello.post({ body: { name: "Dog" } });
</script>
{#await helloPost}
<div>loading...</div>
{:then res}
<div>{res.body.world}</div>
{/await}at src/routes/api/hello.ts
import type { QueryGet } from "svelte-zero-api";
interface Get {
query: {
name: string;
};
}
interface Post {
body: {
name: string;
};
}
// Need return a Promise
// use `Get & QueryGet<Get>` definition types add query.get(...);
export const get = async ({ query }: Get & QueryGet<Get>) => {
return { body: { world: "I'm a " + query.get("name") } };
};
// Need return a Promise
export const post = async ({ body }: Post) => {
return { body: { world: "I'm a " + body.name } };
};- Svelte Zero API use
Proxy, So it ignore IE. - A simple Example
- How about dont't use style-zero-api/watch?
That's all, Thanks read my broken English.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent