Skip to content

Commit

Permalink
feat: add dts docs
Browse files Browse the repository at this point in the history
  • Loading branch information
@florian-lefebvre
florian-lefebvre committed Mar 23, 2024
1 parent 72f15f3 commit 4232a44
Show file tree
Hide file tree
Showing 3 changed files with 48 additions and 84 deletions.
17 changes: 8 additions & 9 deletions docs/astro.config.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -118,22 +118,17 @@ export default defineConfig({
{
label: "addDevToolbarFrameworkApp",
link: "/utilities/add-devtoolbar-framework-app/",
badge: badge("updated"),
},
{
label: "addDts",
link: "/utilities/add-dts/",
badge: badge("updated"),
},
{
label: "addIntegration",
link: "/utilities/add-integration/",
},
{
label: "addVirtualImport",
link: "/getting-started/breaking-changes/#updated-addvirtualimport",
badge: badge("removed"),
attrs: {
style: "opacity:0.5;",
},
badge: badge("updated"),
},
{
label: "addVirtualImports",
Expand All @@ -143,23 +138,27 @@ export default defineConfig({
{
label: "addVitePlugin",
link: "/utilities/add-vite-plugin/",
badge: badge("updated"),
},
{
label: "hasVitePlugin",
link: "/utilities/has-vite-plugin/",
badge: badge("new"),
badge: badge("updated"),
},
{
label: "hasIntegration",
link: "/utilities/has-integration/",
badge: badge("updated"),
},
{
label: "injectDevRoute",
link: "/utilities/inject-dev-route/",
badge: badge("updated"),
},
{
label: "watchIntegration (HMR)",
link: "/utilities/watch-integration/",
badge: badge("updated"),
},
],
},
Expand Down
6 changes: 3 additions & 3 deletions docs/src/content/docs/utilities/add-devtoolbar-framework-app.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ import {
} from "astro-integration-kit";
import Vue from "@astrojs/vue";

export const integration = defineIntegration({
export default defineIntegration({
// ...
setup() {
const { resolve } = createResolver(import.meta.url);
Expand Down Expand Up @@ -143,7 +143,7 @@ import {
} from "astro-integration-kit";
import Vue from "@astrojs/vue";

export const integration = defineIntegration({
export default defineIntegration({
// ...
setup() {
const { resolve } = createResolver(import.meta.url);
Expand Down Expand Up @@ -227,7 +227,7 @@ import {
import Vue from "@astrojs/vue";
import { readFileSync } from "node:fs";

export const integration = defineIntegration({
export default defineIntegration({
// ...
setup() {
const { resolve } = createResolver(import.meta.url);
Expand Down
109 changes: 37 additions & 72 deletions docs/src/content/docs/utilities/add-dts.mdx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,57 +2,30 @@
title: addDts
description: Allows to inject .d.ts file in users project. It will create a file inside `.astro` and reference it from `src/env.d.ts`.
---
import { Tabs, TabItem } from '@astrojs/starlight/components';

`addDts` allows you to inject a `.d.ts` file into the user's project. It will
create a file inside `.astro` and reference it from `src/env.d.ts`. For example:

<Tabs>
<TabItem label="Extended hooks">
```ts title="my-integration/index.ts" /addDts\\b/ {2,6}
import { defineIntegration } from "astro-integration-kit";
import { addDtsPlugin } from "astro-integration-kit/plugins";

export default defineIntegration({
name: "my-integration",
plugins: [addDtsPlugin],
setup({ options }) {
return {
"astro:config:setup": ({ addDts }) => {
addDts({
name: "my-integration",
content: `declare module "virtual:my-integration" {}`
})
}
}
}
})
```
</TabItem>
<TabItem label="Standalone utilities">
```ts title="integration/index.ts" "addDts"
import type { AstroIntegration } from "astro";
import { addDts } from "astro-integration-kit/utilities";

export default function myIntegration(): AstroIntegration {
```ts title="my-integration/index.ts" {3,11-14}
import {
defineIntegration,
addDts
} from "astro-integration-kit";

export default defineIntegration({
// ...
setup() {
return {
name: "my-integration",
hooks: {
"astro:config:setup": ({ config, logger }) => {
addDts({
name: "my-integration",
content: `declare module "virtual:my-integration" {}`,
root: config.root,
srcDir: config.srcDir,
logger,
})
}
"astro:config:setup": (params) => {
addDts(params, {
name: "my-integration",
content: `declare module "virtual:my-integration" {}`
})
}
}
}
```
</TabItem>
</Tabs>
})
```

:::tip
Don't worry about indentation or making your code pretty by hand! `addDts` will do it for you.
Expand All @@ -71,20 +44,18 @@ we recommend you use a `stub` approach:
declare module "virtual:my-integration" {}
```

```ts title="my-integration/index.ts" {15}
import { defineIntegration, createResolver } from "astro-integration-kit";
import { addDtsPlugin } from "astro-integration-kit/plugins";
```ts title="my-integration/index.ts" {2,13}
import { defineIntegration, createResolver, addDts } from "astro-integration-kit";
import { readFileSync } from "node:fs";

export default defineIntegration({
name: "my-integration",
plugins: [addDtsPlugin],
setup({ options }) {
// ...
setup() {
const { resolve } = createResolver(import.meta.url)

return {
"astro:config:setup": ({ addDts }) => {
addDts({
"astro:config:setup": (params) => {
addDts(params, {
name: "my-integration",
content: readFileSync(resolve("./stubs/virtual-import.d.ts"), "utf-8")
})
Expand All @@ -100,19 +71,17 @@ If you want to generate type from user data/input (codegen), you can go for **in

#### Interpolation

```ts title="my-integration/index.ts"
import { defineIntegration } from "astro-integration-kit";
import { addDtsPlugin } from "astro-integration-kit/plugins";
```ts title="my-integration/index.ts" {12-14}
import { defineIntegration, addDts } from "astro-integration-kit";
import { z } from "astro/zod"

export default defineIntegration({
name: "my-integration",
plugins: [addDtsPlugin],
// ...
optionsSchema: z.object({ locales: z.array(z.string()) }),
setup({ options }) {
const { resolve } = createResolver(import.meta.url)

return {
"astro:config:setup": ({ addDts }) => {
addDts({
"astro:config:setup": (params) => {
addDts(params, {
name: "my-integration",
content: `declare module "virtual:my-integration" {
export type Locale: ${options.locales.map(e => `"${e}"`).join(" | ")};
Expand All @@ -126,33 +95,29 @@ export default defineIntegration({

#### Buffer

#### Interpolation

```ts title="my-integration/index.ts"
import { defineIntegration } from "astro-integration-kit";
import { addDtsPlugin } from "astro-integration-kit/plugins";
```ts title="my-integration/index.ts" {10-15,19}
import { defineIntegration, addDts } from "astro-integration-kit";
import { z } from "astro/zod"

export default defineIntegration({
name: "my-integration",
plugins: [addDtsPlugin],
// ...
optionsSchema: z.object({ locales: z.array(z.string()) }),
setup({ options }) {
const { resolve } = createResolver(import.meta.url)

return {
"astro:config:setup": ({ addDts }) => {
"astro:config:setup": (params) => {
let content = `declare module "virtual:my-integration" {
export type Locale:`
for (const locale of locales) {
content += ` | ${locale}`
}
content += ";\n}"

addDts({
addDts(params, {
name: "my-integration",
content
})
}
}
}
})
```
```

0 comments on commit 4232a44

Please sign in to comment.