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
18 changes: 18 additions & 0 deletions .changeset/green-jobs-jog.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
---
"@qwikdev/astro": patch
---

feat: support global config for renderOpts

You can now pass the `renderOpts` option to the `qwik` integration to set global render options for all Qwik components.

For example, let's say we wanted to change the base URL for all Qwik build assets on every component used in an Astro file.

```ts
import { defineConfig } from "astro/config";
import qwik from "@qwikdev/astro";

export default defineConfig({
integrations: [qwik({ include: "**/qwik/*", renderOpts: { base: "my-cdn-url/build" } })]
});
```
2 changes: 1 addition & 1 deletion apps/demo/src/pages/index.astro
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import { Counter as NativeCounter } from "@components/qwik/counter";
</head>
<body>
<div style={{ height: "1000px" }}>
<NativeCounter initial={2} renderOpts={{ base: "http://192.168.68.76:4321/build" }} />
<NativeCounter initial={2} />
</div>
</body>
</html>
1 change: 1 addition & 0 deletions libs/qwikdev-astro/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -61,6 +61,7 @@
},
"bugs": "https://github.com/thejackshelton/@qwikdev/astro/issues",
"dependencies": {
"@inox-tools/aik-mod": "^0.11.0",
"astro-integration-kit": "^0.18.0"
},
"devDependencies": {
Expand Down
3 changes: 2 additions & 1 deletion libs/qwikdev-astro/server.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { isDev } from "@builder.io/qwik/build";
import type { QwikManifest } from "@builder.io/qwik/optimizer";
import { type RenderToStreamOptions, renderToStream } from "@builder.io/qwik/server";
import type { SSRResult } from "astro";
import { renderOpts as globalRenderOpts } from "virtual:qwikdev-astro";

const containerMap = new WeakMap<SSRResult, boolean>();

Expand Down Expand Up @@ -73,7 +74,7 @@ export async function renderToStaticMarkup(
const isInitialContainer = !containerMap.has(this.result);

const renderToStreamOpts: RenderToStreamOptions = {
...(props.renderOpts ?? {}),
...(props.renderOpts ?? globalRenderOpts ?? {}),
containerAttributes: {
style: "display: contents",
...(isDev && { "q-astro-marker": "" })
Expand Down
49 changes: 39 additions & 10 deletions libs/qwikdev-astro/src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,29 @@ import type {
QwikVitePluginOptions,
SymbolMapperFn
} from "@builder.io/qwik/optimizer";
import type { RenderOptions } from "@builder.io/qwik/server";
import type { AstroConfig, AstroIntegration } from "astro";
import { createResolver, defineIntegration, watchDirectory } from "astro-integration-kit";
import { createResolver, defineIntegration, watchDirectory, withPlugins } from "astro-integration-kit";
import { z } from "astro/zod";
import { type PluginOption, build, createFilter } from "vite";
import type { InlineConfig } from "vite";
import aikMod from '@inox-tools/aik-mod';

// TODO: contributing this back to aik-mod where we export the type
type DefineModuleOptions = {
constExports?: Record<string, unknown>;
defaultExport?: unknown;
};

type SetupPropsWithAikMod =
Parameters<
NonNullable<AstroIntegration["hooks"]["astro:config:setup"]>
>[0] & {
defineModule: (
name: string,
options: DefineModuleOptions
) => string;
};

declare global {
var symbolMapperFn: SymbolMapperFn;
Expand All @@ -26,12 +44,14 @@ const FilterPatternSchema = z.union([
z.null()
]);

const name = "@qwikdev/astro";

/**
* This project uses Astro Integration Kit.
* @see https://astro-integration-kit.netlify.app/
*/
export default defineIntegration({
name: "@qwikdev/astro",
name,
optionsSchema: z
.object({
/**
Expand All @@ -48,11 +68,12 @@ export default defineIntegration({
* Enable debug mode with the qwikVite plugin.
*/
debug: z.boolean().optional(),

/**
* Use node's readFileSync to read the manifest. Common for deployment providers that don't support dynamic json imports. When false, please ensure your deployment provider supports dynamic json imports, through environment variables or other means.
* Options passed into each Qwik component's `renderToStream` call.
*/
isNode: z.boolean().optional().default(true)
renderOpts: z.custom<RenderOptions>((data) => {
return typeof data === "object" && data !== null;
}).optional()
})
.optional(),

Expand All @@ -77,7 +98,7 @@ export default defineIntegration({

const lifecycleHooks: AstroIntegration["hooks"] = {
"astro:config:setup": async (setupProps) => {
const { addRenderer, updateConfig, config } = setupProps;
const { addRenderer, updateConfig, config, defineModule } = setupProps as SetupPropsWithAikMod;
astroConfig = config;
// integration HMR support
watchDirectory(setupProps, resolver());
Expand All @@ -86,6 +107,12 @@ export default defineIntegration({
serverEntrypoint: resolver("../server.ts")
});

defineModule('virtual:qwikdev-astro', {
constExports: {
renderOpts: options?.renderOpts ?? {}
}
});

/** Relative paths, as the Qwik optimizer handles normalization */
srcDir = getRelativePath(astroConfig.root.pathname, astroConfig.srcDir.pathname);

Expand Down Expand Up @@ -319,12 +346,14 @@ export default defineIntegration({
}
};

return {
hooks: lifecycleHooks
};
return withPlugins({
name,
hooks: lifecycleHooks,
plugins: [aikMod]
});
}
});

function getRelativePath(from: string, to: string) {
return to.replace(from, "") || ".";
}
}
8 changes: 5 additions & 3 deletions libs/qwikdev-astro/src/virtual.d.ts
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
declare module "inox:inline-mod:mod_0" {
export const isNode: boolean;
export const qAstroManifestPath: string;
declare module "virtual:qwikdev-astro" {
import type { RenderOptions } from "@builder.io/qwik/server";

const renderOpts: RenderOptions;
export { renderOpts };
}
43 changes: 43 additions & 0 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading