Skip to content
Merged
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
2 changes: 1 addition & 1 deletion astro.sidebar.ts
Original file line number Diff line number Diff line change
Expand Up @@ -136,13 +136,13 @@ export const sidebar = [
group('reference.experimental', {
items: [
'reference/experimental-flags',
'reference/experimental-flags/responsive-images',
'reference/experimental-flags/fonts',
'reference/experimental-flags/client-prerender',
'reference/experimental-flags/content-intellisense',
'reference/experimental-flags/preserve-scripts-order',
'reference/experimental-flags/heading-id-compat',
'reference/experimental-flags/csp',
'reference/experimental-flags/live-content-collections',
],
}),
'reference/legacy-flags',
Expand Down
2 changes: 2 additions & 0 deletions public/_redirects
Original file line number Diff line number Diff line change
Expand Up @@ -38,6 +38,8 @@
/:lang/reference/experimental-flags/sessions/ /:lang/guides/sessions/
/:lang/reference/experimental-flags/svg/ /:lang/guides/images/
/:lang/reference/experimental-flags/serialized-configuration/ /:lang/reference/modules/astro-config/
/:lang/reference/experimental-flags/responsive-images/ /:lang/guides/images/


# Very old docs site redirects
# Once upon a time these URLs existed, so we try to keep them meaning something.
Expand Down
492 changes: 309 additions & 183 deletions src/content/docs/en/guides/images.mdx

Large diffs are not rendered by default.

92 changes: 92 additions & 0 deletions src/content/docs/en/guides/integrations-guide/cloudflare.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -248,6 +248,98 @@ export default defineConfig({
});
```

### `workerEntryPoint`
<p>

**Type:** `{path: string | URL, namedExports: string[]}`<br />
**Default:** `{ path: '@astrojs/cloudflare/entrypoints/server.js', namedExports: [] }`<br />
<Since v="12.6.0" pkg="@astrojs/cloudflare"/>
</p>


A configuration object to specify the [workerEntryPoint](https://developers.cloudflare.com/workers/runtime-apis/bindings/service-bindings/rpc/) for your Cloudflare Worker when you use the `astro build` command.

It allows you to optionally specify both a custom file `path` and `namedExports`:

```js title="astro.config.mjs"
import cloudflare from '@astrojs/cloudflare';
import { defineConfig } from 'astro/config';

export default defineConfig({
adapter: cloudflare({
workerEntryPoint: {
path: 'src/worker.ts',
namedExports: ['MyDurableObject']
}
}),
});
```

#### `workerEntryPoint.path`

<p>

**Type:** `string`<br />
**Default:** `@astrojs/cloudflare/entrypoints/server.js`
<Since v="12.6.0" pkg="@astrojs/cloudflare" />
</p>

The path to the entry file. This should be a relative path from the root of your Astro project.

By default, the adapter uses a generic entry file, which only supports the `fetch` handler.

To support other [Cloudflare invocation handlers](https://developers.cloudflare.com/workers/observability/logs/workers-logs/#invocation-logs), you can create a custom file to use as the entry point. This is useful if you want to use features that require other handlers (e.g. Durable Objects, Cloudflare Queues, Scheduled Invocations).

#### `workerEntryPoint.namedExports`

<p>

**Type:** `[]`<br />
**Default:** `['default']`
<Since v="12.6.0" pkg="@astrojs/cloudflare" />
</p>

An array of named exports to use for the entry file.

Provide any additional defined named exports of your [custom entry file](#creating-a-custom-cloudflare-worker-entry-file) (e.g. `DurableObjects`). If not provided, only default exports will be included.

#### Creating a custom Cloudflare Worker entry file

The custom entry file must export the `createExports()` function with a `default` export including all the handlers you need.

The following example entry file registers a Durable Object and a queue handler:

```ts title="src/worker.ts"
import type { SSRManifest } from 'astro';

import { App } from 'astro/app';
import { handle } from '@astrojs/cloudflare/handler'
import { DurableObject } from 'cloudflare:workers';

class MyDurableObject extends DurableObject<Env> {
constructor(ctx: DurableObjectState, env: Env) {
super(ctx, env)
}
}

export function createExports(manifest: SSRManifest) {
const app = new App(manifest);
return {
default: {
async fetch(request, env, ctx) {
await env.MY_QUEUE.send("log");
return handle(manifest, app, request, env, ctx);
},
async queue(batch, _env) {
let messages = JSON.stringify(batch.messages);
console.log(`consumed from our queue: ${messages}`);
}
} satisfies ExportedHandler<Env>,
MyDurableObject: MyDurableObject,
}
}
```

## Cloudflare runtime

### Usage
Expand Down
63 changes: 38 additions & 25 deletions src/content/docs/en/reference/configuration-reference.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -1133,65 +1133,78 @@ You can use wildcards to define the permitted `hostname` and `pathname` values a
- End with '/**' to allow all sub-routes ('startsWith').
- End with '/*' to allow only one level of sub-route.

### image.experimentalLayout
### image.responsiveStyles

<p>

**Type:** `boolean`<br />
**Default:** `false`
<Since v="5.10.0" />
</p>

Whether to automatically add global styles for responsive images. You should enable this option unless you are styling the images yourself.

This option is only used when `layout` is set to `constrained`, `full-width`, or `fixed` using the configuration or the `layout` prop on the image component.

See [the Images guide](/en/guides/images/#responsive-image-styles) for more information.


### image.layout

<p>

**Type:** `ImageLayout`<br />
**Default:** `undefined`
**Default:** `undefined`<br />
<Since v="5.10.0" />
</p>

The default layout type for responsive images. Can be overridden by the `layout` prop on the image component.
Requires the `experimental.responsiveImages` flag to be enabled.
- `constrained` - The image will scale to fit the container, maintaining its aspect ratio, but will not exceed the specified dimensions.
- `fixed` - The image will maintain its original dimensions.
- `full-width` - The image will scale to fit the container, maintaining its aspect ratio.

### image.experimentalObjectFit
See [the `layout` component property](/en/reference/modules/astro-assets/#layout) for more details.

### image.objectFit

<p>

**Type:** `ImageFit`<br />
**Default:** `"cover"`
**Default:** `"cover"`<br />
<Since v="5.10.0" />
</p>

The default object-fit value for responsive images. Can be overridden by the `fit` prop on the image component.
Requires the `experimental.responsiveImages` flag to be enabled.
The [`object-fit` CSS property value](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit) for responsive images. Can be overridden by the `fit` prop on the image component.
Requires a value for `layout` to be set.

See [the `fit` component property](/en/reference/modules/astro-assets/#fit) for more details.

### image.experimentalObjectPosition
### image.objectPosition

<p>

**Type:** `string`<br />
**Default:** `"center"`
**Default:** `"center"`<br />
<Since v="5.10.0" />
</p>

The default object-position value for responsive images. Can be overridden by the `position` prop on the image component.
Requires the `experimental.responsiveImages` flag to be enabled.
The default [`object-position` CSS property value](https://developer.mozilla.org/en-US/docs/Web/CSS/object-position) for responsive images. Can be overridden by the `position` prop on an individual image component. Requires a value for `layout` to be set.

See [the `position` component property](/en/reference/modules/astro-assets/#position) for more details.

### image.experimentalBreakpoints
### image.breakpoints

<p>

**Type:** `Array<number>`<br />
**Default:** `[640, 750, 828, 1080, 1280, 1668, 2048, 2560] | [640, 750, 828, 960, 1080, 1280, 1668, 1920, 2048, 2560, 3200, 3840, 4480, 5120, 6016]`
**Default:** `[640, 750, 828, 1080, 1280, 1668, 2048, 2560] | [640, 750, 828, 960, 1080, 1280, 1668, 1920, 2048, 2560, 3200, 3840, 4480, 5120, 6016]`<br />
<Since v="5.10.0" />
</p>

The breakpoints used to generate responsive images. Requires the `experimental.responsiveImages` flag to be enabled. The full list is not normally used,
The breakpoints used to generate responsive images. Requires a value for `layout` to be set. The full list is not normally used,
but is filtered according to the source and output size. The defaults used depend on whether a local or remote image service is used. For remote services
the more comprehensive list is used, because only the required sizes are generated. For local services, the list is shorter to reduce the number of images generated.

### image.experimentalDefaultStyles

<p>

**Type:** `boolean`<br />
**Default:** `true`
</p>

Whether to automatically add global styles to ensure that experimental images resize correctly. This is enabled by default, but can be disabled if you want to manage the styles yourself.
This option is only used when the `experimental.responsiveImages` flag is enabled.

## Markdown Options


Expand Down
1 change: 1 addition & 0 deletions src/content/docs/en/reference/error-reference.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -126,6 +126,7 @@ The following reference is a complete list of the errors you may encounter while
- [**InvalidContentEntryDataError**](/en/reference/errors/invalid-content-entry-data-error/)<br/>Content entry data does not match schema.
- [**ContentLoaderReturnsInvalidId**](/en/reference/errors/content-loader-returns-invalid-id/)<br/>Content loader returned an entry with an invalid `id`.
- [**ContentEntryDataError**](/en/reference/errors/content-entry-data-error/)<br/>Content entry data does not match schema.
- [**LiveContentConfigError**](/en/reference/errors/live-content-config-error/)<br/>Error in live content config.
- [**ContentLoaderInvalidDataError**](/en/reference/errors/content-loader-invalid-data-error/)<br/>Content entry is missing an ID
- [**InvalidContentEntrySlugError**](/en/reference/errors/invalid-content-entry-slug-error/)<br/>Invalid content entry slug.
- [**ContentSchemaContainsSlugError**](/en/reference/errors/content-schema-contains-slug-error/)<br/>Content Schema should not contain `slug`.
Expand Down
25 changes: 25 additions & 0 deletions src/content/docs/en/reference/errors/live-content-config-error.mdx
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
---
# NOTE: This file is auto-generated from 'scripts/error-docgen.mjs'
# Do not make edits to it directly, they will be overwritten.
# Instead, change this file: https://github.com/withastro/astro/blob/main/packages/astro/src/core/errors/errors-data.ts
# Translators, please remove this note and the <DontEditWarning/> component.

title: Error in live content config.
i18nReady: true
githubURL: https://github.com/withastro/astro/blob/main/packages/astro/src/core/errors/errors-data.ts
---
import DontEditWarning from '~/components/DontEditWarning.astro'

<DontEditWarning />


> **Example error message:**<br/>
The schema cannot be a function for live collections. Please use a schema object instead. Check your collection definitions in your live content config file.

## What went wrong?
Error in live content config.

**See Also:**
- [Experimental live content](https://astro.build/en/reference/experimental-flags/live-content-collections/)


Loading