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
9 changes: 8 additions & 1 deletion src/content/docs/en/guides/integrations-guide/alpinejs.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@ githubIntegrationURL: 'https://github.com/withastro/astro/tree/main/packages/int
category: renderer
i18nReady: true
---
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
import Since from '~/components/Since.astro';

This **[Astro integration][astro-integration]** adds [Alpine.js](https://alpinejs.dev/) to your project so that you can use Alpine.js anywhere on your page.

Expand Down Expand Up @@ -96,6 +97,12 @@ export default defineConfig({

### `entrypoint`

<p>

**Type:** `string`<br />
<Since v="0.4.0" pkg="@astrojs/alpinejs" />
</p>

You can extend Alpine by setting the `entrypoint` option to a root-relative import specifier (e.g. `entrypoint: "/src/entrypoint"`).

The default export of this file should be a function that accepts an Alpine instance prior to starting. This allows the use of custom directives, plugins and other customizations for advanced use cases.
Expand Down
31 changes: 26 additions & 5 deletions src/content/docs/en/guides/integrations-guide/db.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -129,6 +129,11 @@ export default defineConfig({

### `columns`

<p>

**Type:** `ColumnsConfig`
</p>

Table columns are configured using the `columns` object:

```ts
Expand Down Expand Up @@ -184,6 +189,11 @@ type UserTableInferInsert = {

### `indexes`

<p>

**Type:** `{ on: string | string[]; unique?: boolean | undefined; name?: string | undefined; }[]`
</p>

Table indexes are used to improve lookup speeds on a given column or combination of columns. The `indexes` property accepts an array of configuration objects specifying the columns to index:

```ts title="db/config.ts" {9-11}
Expand All @@ -205,12 +215,17 @@ This will generate a unique index on the `authorId` and `published` columns with

The following configuration options are available for each index:

- `on`: `string | string[]` - A single column or array of column names to index.
- `unique`: `boolean` - Set to `true` to enforce unique values across the indexed columns.
- `name`: `string` (optional) - A custom name for the unique index. This will override Astro's generated name based on the table and column names being indexed (e.g. `Comment_authorId_published_idx`). Custom names are global, so ensure index names do not conflict between tables.
- `on` - A single column or array of column names to index.
- `unique` (optional) - Set to `true` to enforce unique values across the indexed columns.
- `name` (optional) - A custom name for the unique index. This will override Astro's generated name based on the table and column names being indexed (e.g. `Comment_authorId_published_idx`). Custom names are global, so ensure index names do not conflict between tables.

### `foreignKeys`

<p>

**Type:** `{ columns: string | string[]; references: () => Column | Column[]; }[]`
</p>

:::tip

`foreignKeys` is an advanced API for relating multiple table columns. If you only need to reference a single column, try using [the column `references` property.](#columns)
Expand Down Expand Up @@ -246,8 +261,8 @@ const Comment = defineTable({

Each foreign key configuration object accepts the following properties:

- `columns`: `string[]` - An array of column names to relate to the referenced table.
- `references`: `() => Column[]` - A function that returns an array of columns from the referenced table.
- `columns` - A single column or array of column names to relate to the referenced table.
- `references` - A function that returns a single column or an array of columns from the referenced table.

## Astro DB CLI reference

Expand Down Expand Up @@ -288,6 +303,12 @@ Execute a raw SQL query against your database. Use the `--remote` flag to run ag

### `isDbError()`

<p>

**Type:** `(err: unknown) => boolean`<br />
<Since v="0.9.1" pkg="@astrojs/db" />
</p>

The `isDbError()` function checks if an error is a libSQL database exception. This may include a foreign key constraint error when using references, or missing fields when inserting data. You can combine `isDbError()` with a try / catch block to handle database errors in your application:

```ts title="src/pages/api/comment/[id].ts" "idDbError"
Expand Down
18 changes: 16 additions & 2 deletions src/content/docs/en/guides/integrations-guide/markdoc.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -8,10 +8,10 @@ githubIntegrationURL: 'https://github.com/withastro/astro/tree/main/packages/int
category: other
i18nReady: true
---
import { FileTree } from '@astrojs/starlight/components';
import { FileTree, Steps } from '@astrojs/starlight/components';
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
import { Steps } from '@astrojs/starlight/components';
import ReadMore from '~/components/ReadMore.astro';
import Since from '~/components/Since.astro';

This **[Astro integration][astro-integration]** enables the usage of [Markdoc](https://markdoc.dev/) to create components, pages, and content collection entries.

Expand Down Expand Up @@ -593,6 +593,13 @@ The Astro Markdoc integration handles configuring Markdoc options and capabiliti

### `allowHTML`

<p>

**Type:** `boolean`<br />
**Default:** `false`<br />
<Since v="0.4.4" pkg="@astrojs/markdoc" />
</p>

Enables writing HTML markup alongside Markdoc tags and nodes.

By default, Markdoc will not recognize HTML markup as semantic content.
Expand All @@ -615,6 +622,13 @@ When `allowHTML` is enabled, HTML markup inside Markdoc documents will be render

### `ignoreIndentation`

<p>

**Type:** `boolean`<br />
**Default:** `false`<br />
<Since v="0.7.0" pkg="@astrojs/markdoc" />
</p>

By default, any content that is indented by four spaces is treated as a code block. Unfortunately, this behavior makes it difficult to use arbitrary levels of indentation to improve the readability of documents with complex structure.

When using nested tags in Markdoc, it can be helpful to indent the content inside of tags so that the level of depth is clear. To support arbitrary indentation, we have to disable the indent-based code blocks and modify several other markdown-it parsing rules that account for indent-based code blocks. These changes can be applied by enabling the ignoreIndentation option.
Expand Down
29 changes: 24 additions & 5 deletions src/content/docs/en/guides/integrations-guide/mdx.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -271,8 +271,12 @@ MDX does not support passing remark and rehype plugins as a string. You should i

### `extendMarkdownConfig`

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

**Type:** `boolean`<br />
**Default:** `true`<br />
<Since v="0.15.0" pkg="@astrojs/mdx" />
</p>

MDX will extend [your project's existing Markdown configuration](/en/reference/configuration-reference/#markdown-options) by default. To override individual options, you can specify their equivalent in your MDX configuration.

Expand Down Expand Up @@ -326,13 +330,25 @@ export default defineConfig({

### `recmaPlugins`

<p>

**Type:** `PluggableList`<br />
Copy link
Member

Choose a reason for hiding this comment

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

But for mdx I don't know who we could ask... I hesitated to use unified.PluggableList, but I wasn't sure this would be more explicit for people.

Let's ask @delucis !

(Armand's concern is regarding the entry for recmaPlugins: "PluggableList is not an Astro type but a unified one and I don't think we reexport it, but I don't have a better idea to describe the type.)

**Default:** `[]`<br />
<Since v="0.11.5" pkg="@astrojs/mdx" />
</p>

These are plugins that modify the output [estree](https://github.com/estree/estree) directly. This is useful for modifying or injecting JavaScript variables in your MDX files.

We suggest [using AST Explorer](https://astexplorer.net/) to play with estree outputs, and trying [`estree-util-visit`](https://unifiedjs.com/explore/package/estree-util-visit/) for searching across JavaScript nodes.

### `optimize`

* **Type:** `boolean | { ignoreElementNames?: string[] }`
<p>

**Type:** `boolean | { ignoreElementNames?: string[] }`<br />
**Default:** `false`<br />
<Since v="0.19.5" pkg="@astrojs/mdx" />
</p>

This is an optional configuration setting to optimize the MDX output for faster builds and rendering via an internal rehype plugin. This may be useful if you have many MDX files and notice slow builds. However, this option may generate some unescaped HTML, so make sure your site's interactive parts still work correctly after enabling it.

Expand All @@ -354,9 +370,12 @@ export default defineConfig({

#### `ignoreElementNames`

* **Type:** `string[]`
<p>

**Type:** `string[]`<br />
<Since v="3.0.0" pkg="@astrojs/mdx" />
</p>

<p><Since pkg="@astrojs/mdx" v="3.0.0" /></p>
Previously known as `customComponentNames`.

An optional property of `optimize` to prevent the MDX optimizer from handling certain element names, like [custom components passed to imported MDX content via the components prop](/en/guides/integrations-guide/mdx/#custom-components-with-imported-mdx).
Expand Down
9 changes: 4 additions & 5 deletions src/content/docs/en/guides/integrations-guide/partytown.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -107,10 +107,10 @@ export default defineConfig({
});
```

This mirrors the [Partytown config object](https://partytown.qwik.dev/configuration/).
This mirrors the [Partytown config object](https://partytown.qwik.dev/configuration/) and all options can be set in `partytown.config`. Some common configuration options for Astro projects are described on this page.


### config.debug
### Enabling debug mode

Partytown ships with a `debug` mode; enable or disable it by passing `true` or `false` to `config.debug`. If [`debug` mode](https://partytown.qwik.dev/debugging) is enabled, it will output detailed logs to the browser console.

Expand All @@ -128,7 +128,7 @@ export default defineConfig({
});
```

### config.forward
### Forwarding variables

Third-party scripts typically add variables to the `window` object so that you can communicate with them throughout your site. But when a script is loaded in a web-worker, it doesn't have access to that global `window` object.

Expand All @@ -150,7 +150,7 @@ export default defineConfig({
});
```

### config.resolveUrl
### Proxying requests

Some third-party scripts may require [proxying](https://partytown.qwik.dev/proxying-requests/) through `config.resolveUrl()`, which runs inside the service worker. You can set this configuration option to check for a specific URL, and optionally return a proxied URL instead:

Expand Down Expand Up @@ -211,4 +211,3 @@ Note that the integration config will override `window.partytown` if you set a p
* [Optimise Google Analytics using Partytown in Astro](https://ricostacruz.com/posts/google-analytics-in-astro)

[astro-integration]: /en/guides/integrations-guide/

16 changes: 13 additions & 3 deletions src/content/docs/en/guides/integrations-guide/preact.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -133,7 +133,13 @@ The Astro Preact integration handles how Preact components are rendered and it h

For basic usage, you do not need to configure the Preact integration.

### compat
### `compat`

<p>

**Type:** `boolean`<br />
<Since pkg="@astrojs/preact" v="0.3.0" />
</p>

You can enable `preact/compat`, Preact’s compatibility layer for rendering React components without needing to install or ship React’s larger libraries to your users’ web browsers.

Expand Down Expand Up @@ -167,9 +173,13 @@ Check out the [`pnpm` overrides](https://pnpm.io/package_json#pnpmoverrides) and
Currently, the `compat` option only works for React libraries that export code as ESM. If an error happens during build-time, try adding the library to `vite.ssr.noExternal: ['the-react-library']` in your `astro.config.mjs` file.
:::

### devtools
### `devtools`

<p>

<p><Since pkg="@astrojs/preact" v="3.3.0" /></p>
**Type:** `boolean`<br />
<Since pkg="@astrojs/preact" v="3.3.0" />
</p>

You can enable [Preact devtools](https://preactjs.github.io/preact-devtools/) in development by passing an object with `devtools: true` to your `preact()` integration config:

Expand Down
9 changes: 6 additions & 3 deletions src/content/docs/en/guides/integrations-guide/solid-js.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -117,9 +117,13 @@ To use your first SolidJS component in Astro, head to our [UI framework document

## Configuration

### devtools
### `devtools`

<p><Since pkg="@astrojs/solid-js" v="4.2.0" /></p>
<p>

**Type:** `boolean`<br />
<Since pkg="@astrojs/solid-js" v="4.2.0" />
</p>

You can enable [Solid DevTools](https://github.com/thetarnav/solid-devtools) in development by passing an object with `devtools: true` to your `solid()` integration config and adding `solid-devtools` to your project dependencies:

Expand Down Expand Up @@ -232,4 +236,3 @@ Feel free to add additional Suspense boundaries according to your preference.
[solid-create-resource]: https://www.solidjs.com/docs/latest/api#createresource

[solid-lazy-components]: https://www.solidjs.com/docs/latest/api#lazy

Loading