Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: add custom preset instructions #1409

Merged
merged 6 commits into from
Jul 14, 2023
Merged
Changes from 3 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
74 changes: 72 additions & 2 deletions docs/content/2.deploy/3.custom-presets.md
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,77 @@ icon: ri:file-code-line
# Custom Preset

::alert{type="warning"}
**Work in Progress**
**Advanced**
:br
Documentation for this section is not yet complete.
This is an advanced feature.
pi0 marked this conversation as resolved.
Show resolved Hide resolved
::

If you want to use a provider that Nitro doesn't support, or want to modify an existing one, you can create a custom preset.
pi0 marked this conversation as resolved.
Show resolved Hide resolved

To create a custom preset, you need to use the `defineNitroPreset` helper, and specify a runtime entry point.

```ts [custom-preset.ts]
import type { NitroPreset } from "nitropack";
import { fileURLToPath } from "node:url"

export default <NitroPreset>{
extends: "node-server", // You can extend existing presets
entry: fileURLToPath(new URL("./custom-entry.ts", import.meta.url)),
hooks: {
compiled() {
console.info("Using Custom Preset!");
},
},
};
```

In your entry point, use the virtual files to access the Nitro App.
The entry point will be used by your server or provider, and you can fully customise its behaviour.

```ts [custom-entry.ts]
import "#internal/nitro/virtual/polyfill";
const nitroApp = useNitroApp();

// This syntax would be used for a cloudflare worker with the module syntax.
export default {
async fetch(
request: Request,
env: CFModuleEnv,
context: ExecutionContext
) {
console.log("This is a custom preset !")
//const response = await nitroApp.localFetch(...) <- Use localFetch to access your nitro application.
// ...
}
async queue(){
// queue logic
}
};
```

Then in your nitro config file, you can use your custom preset.

::code-group
```ts [nitro.config.ts]
import { defineNitroConfig } from "nitropack/config";
export default defineNitroConfig({
preset: "./custom-preset",
});
```
```ts [nuxt.config.ts]
export default defineNuxtConfig({
nitro: {
preset: "./custom-preset",
}
});
```
::

You an use the official Nitro [preset starter](https://github.com/unjs/nitro-preset-starter/blob/main/preset/nitro.config.ts) for a working example.
pi0 marked this conversation as resolved.
Show resolved Hide resolved

Refer to the Nitro [source code](https://github.com/unjs/nitro/) directly to have a better understanding of presets and entry points.

Here are two community examples of custom presets :

- [Lambda-edge](https://github.com/jdevdevdev/nuxt-sst/blob/lambda-edge@%7B2023-07-03T11:20:03Z%7D/nuxt-app/server/nitro/preset/entry.ts)
- [Fastify plugin](https://github.com/auguwu/fastify-nitro)
pi0 marked this conversation as resolved.
Show resolved Hide resolved