feat: add nitro generated types (#10)

README.md

@@ -106,15 +106,7 @@ const { data } = useFetch("/not-api/this/is/cool")
 </template>
 ```
 
-This will generate a get handler: `server/.generated/not-api/this/is/cool.get.ts`.
-
-A `.gitignore` file will be generated for you. Do not commit the generated files in your repository.
-
-## ⚗ Troubleshooting
-
-While developing your application, you might encounter a `Page Not Found` error while hitting your extracted server handlers.
-To fix this, you can delete the vite cache (usually in `node_modules/.cache/vite`). 
-If you need more help, feel free to open an issue.
+A `server/.generated/not-api/this/is/cool.get.ts` get handler will be generated.
 
 ## 💡 FAQ
 
@@ -128,11 +120,14 @@ If you need more help, feel free to open an issue.
 
 You can combine this with another library such as https://github.com/Hebilicious/form-actions-nuxt if you want to use form actions and loaders.
 
+**Should I commit the generated files to my repository?**
+No. A `.gitignore` file will be generated for you.
+
 ## 📝 TODO
 
 - [x] Integrates with form-actions & loaders
+- [x] Add useFetch typings
 - [ ] Support multiple server blocks in a single file
-- [ ] Add useFetch typings
 
 ## 🫴 Contributing
 

packages/server-block-nuxt/src/module.ts

@@ -4,7 +4,7 @@ import { addPlugin, createResolver, defineNuxtModule, useNitro } from "@nuxt/kit
 import ExtractSFCBlock from "@hebilicious/extract-sfc-block"
 
 import { loadFile } from "magicast"
-import type { NitroEventHandler } from "nitropack"
+import { type NitroEventHandler, writeTypes } from "nitropack"
 import { SupportedMethods, getRoute, logger, makePathShortener, writeHandlers } from "./utils"
 
 export async function* walkFiles(dir: string): AsyncGenerator<string> {
@@ -82,6 +82,7 @@ export default defineNuxtModule({
           }
         }
         // await useNuxt().hooks.callHookParallel("app:data:refresh") @todo find a way to refresh data here
+        await writeTypes(useNitro()) // Write Nitro handler types for useFetch
         logger.info("[update]: Nitro Handlers \n", useNitro().options.handlers.map(h => h.route))
       }
     }

playgrounds/basic/pages/index.vue

@@ -1,10 +1,10 @@
-<server lang="ts" path="this/is/another/api">
+<server lang="ts" path="/this/is/another/api">
   const message = "Hello World!!!"
   export const GET = defineEventHandler(() => ({ message }))
   </server>
 
 <script setup lang="ts">
-const { data } = await useFetch("this/is/another/api")
+const { data } = await useFetch("/this/is/another/api")
 </script>
 
 <template>