Skip to content
Closed
Show file tree
Hide file tree
Changes from all 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
6 changes: 6 additions & 0 deletions .changeset/popular-cats-own.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
---
'@sveltejs/adapter-cloudflare-workers': minor
'@sveltejs/adapter-cloudflare': minor
---

feat: adds an `external` option to specify packages that should not be bundled as part of the build such as those provided by Node.js
2 changes: 1 addition & 1 deletion .github/PULL_REQUEST_TEMPLATE.md
Original file line number Diff line number Diff line change
Expand Up @@ -7,4 +7,4 @@
- [ ] Run the tests with `pnpm test` and lint the project with `pnpm lint` and `pnpm check`

### Changesets
- [ ] If your PR makes a change that should be noted in one or more packages' changelogs, generate a changeset by running `pnpm changeset` and following the prompts. Changesets that add features should be `minor` and those that fix bugs should be `patch`. Please prefix changeset messages with `feat:`, `fix:`, or `chore:`.
- [ ] Run `pnpm changeset` for user-visible changes and follow the prompts. Changeset messages should generally be prefixed with `feat:` or `fix:`. PRs can also be prefixed with `chore:` or `docs:`, which typically won't require a changeset as they're not user-visible.
2 changes: 1 addition & 1 deletion CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -114,7 +114,7 @@ git config core.hookspath .githooks

### Generating changelogs

For changes to be reflected in package changelogs, run `pnpm changeset` and follow the prompts.
Run `pnpm changeset` for user-visible changes and follow the prompts. Changeset messages should generally be prefixed with `feat:` or `fix:`. PRs can also be prefixed with `chore:` or `docs:`, which typically won't require a changeset as they're not user-visible.

## Releases

Expand Down
11 changes: 10 additions & 1 deletion documentation/docs/25-build-and-deploy/60-adapter-cloudflare.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,14 +28,19 @@ export default {
routes: {
include: ['/*'],
exclude: ['<all>']
}
},
external: [ 'fs' ]
})
}
};
```

## Options

The adapter accepts two options: `routes` and `external`.

### `routes`

The `routes` option allows you to customise the [`_routes.json`](https://developers.cloudflare.com/pages/platform/functions/routing/#create-a-_routesjson-file) file generated by `adapter-cloudflare`.

- `include` defines routes that will invoke a function, and defaults to `['/*']`
Expand All @@ -47,6 +52,10 @@ The `routes` option allows you to customise the [`_routes.json`](https://develop

You can have up to 100 `include` and `exclude` rules combined. Generally you can omit the `routes` options, but if (for example) your `<prerendered>` paths exceed that limit, you may find it helpful to manually create an `exclude` list that includes `'/articles/*'` instead of the auto-generated `['/articles/foo', '/articles/bar', '/articles/baz', ...]`.

### `external`

`external` is equivalent to the respective [_external_ option of esbuild](https://esbuild.github.io/api/#external). You can use it to mark a file or package as external to exclude it from your build. Typically, this can be used for packages that do import _NodeJS_ modules such as `fs`.

## Deployment

Please follow the [Get Started Guide](https://developers.cloudflare.com/pages/get-started) for Cloudflare Pages to begin.
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -61,9 +61,9 @@ Then, you can build your app and deploy it:
wrangler publish
```

## Custom config
## Adapter configuration

If you would like to use a config file other than `wrangler.toml`, you can do like so:
The adapter configuration accepts two options: `config` and `external`.

```js
// @errors: 2307
Expand All @@ -72,11 +72,24 @@ import adapter from '@sveltejs/adapter-cloudflare-workers';

export default {
kit: {
adapter: adapter({ config: '<your-wrangler-name>.toml' })
adapter: adapter({
config: '<your-wrangler-name>.toml',
external: [ 'fs' ]
})
}
};
```

### Custom config
Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Should I change this one to config as well, like:

Suggested change
### Custom config
### `config`

That would be consistent with the other file, IMO.


If you would like to use a config file other than the default `wrangler.toml`, set `config` to the name of the file. The path is relative to the root of your project.

### `external`

`external` is equivalent to the respective [_external_ option of esbuild](https://esbuild.github.io/api/#external). You can use it to mark a file or package as external to exclude it from your build. Typically, this can be used for packages that do import _NodeJS_ modules such as `fs`.

The values `__STATIC_CONTENT_MANIFEST` and `cloudflare:*` are always in the list of excluded packages and this can't be changed.

## Bindings

The [`env`](https://developers.cloudflare.com/workers/runtime-apis/fetch-event#parameters) object contains your project's [bindings](https://developers.cloudflare.com/workers/platform/environment-variables/), which consist of KV/DO namespaces, etc. It is passed to SvelteKit via the `platform` property, along with `context` and `caches`, meaning that you can access it in hooks and endpoints:
Expand Down Expand Up @@ -120,4 +133,4 @@ When deploying to workers, the server generated by SvelteKit is bundled into a s

### Accessing the file system

You can't access the file system through methods like `fs.readFileSync` in Serverless/Edge environments. If you need to access files that way, do that during building the app through [prerendering](https://kit.svelte.dev/docs/page-options#prerender). If you have a blog for example and don't want to manage your content through a CMS, then you need to prerender the content (or prerender the endpoint from which you get it) and redeploy your blog everytime you add new content.
You can't access the file system through methods like `fs.readFileSync` in Serverless/Edge environments. If you need to access files that way, do that during building the app through [prerendering](https://kit.svelte.dev/docs/page-options#prerender). If you have a blog for example and don't want to manage your content through a CMS, then you need to prerender the content (or prerender the endpoint from which you get it) and redeploy your blog everytime you add new content.
15 changes: 14 additions & 1 deletion packages/adapter-cloudflare-workers/index.d.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,17 @@
import { Adapter } from '@sveltejs/kit';
import './ambient.js';

export default function plugin(options: { config?: string }): Adapter;
export default function plugin(options?: AdapterOptions): Adapter;

export interface AdapterOptions {
/**
* List of packages that should not be bundled.
*/
external?: string[];

/**
* The name of the wrangler config file to use.
* Defaults to `wrangler.toml`.
*/
config?: string;
}
8 changes: 4 additions & 4 deletions packages/adapter-cloudflare-workers/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -15,12 +15,12 @@ import { fileURLToPath } from 'node:url';
*/

/** @type {import('.').default} */
export default function ({ config = 'wrangler.toml' } = {}) {
export default function (options = {}) {
return {
name: '@sveltejs/adapter-cloudflare-workers',

async adapt(builder) {
const { main, site } = validate_config(builder, config);
const { main, site } = validate_config(builder, options.config ?? 'wrangler.toml');

const files = fileURLToPath(new URL('./files', import.meta.url).href);
const tmp = builder.getBuildDirectory('cloudflare-workers-tmp');
Expand Down Expand Up @@ -62,11 +62,11 @@ export default function ({ config = 'wrangler.toml' } = {}) {
entryPoints: [`${tmp}/entry.js`],
outfile: main,
bundle: true,
external: ['__STATIC_CONTENT_MANIFEST', 'cloudflare:*'],
format: 'esm',
loader: {
'.wasm': 'copy'
}
},
external: ['__STATIC_CONTENT_MANIFEST', 'cloudflare:*', ...(options.external ?? [])]
});

builder.log.minor('Copying assets...');
Expand Down
5 changes: 5 additions & 0 deletions packages/adapter-cloudflare/index.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,11 @@ import './ambient.js';
export default function plugin(options?: AdapterOptions): Adapter;

export interface AdapterOptions {
/**
* List of packages that should not be bundled.
*/
external?: string[];

/**
* Customize the automatically-generated `_routes.json` file
* https://developers.cloudflare.com/pages/platform/functions/routing/#create-a-_routesjson-file
Expand Down
2 changes: 1 addition & 1 deletion packages/adapter-cloudflare/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -58,7 +58,7 @@ export default function (options = {}) {
loader: {
'.wasm': 'copy'
},
external: ['cloudflare:*']
external: ['cloudflare:*', ...(options.external ?? [])]
});
}
};
Expand Down