@gjsify/rolldown-plugin-gjsify 0.3.15 → 0.3.17

package/lib/app/browser.js

@@ -50,7 +50,6 @@ export const setupForBrowser = async (input) => {
         output: {
             ...input.output,
             format: 'esm',
-            minify: false,
             sourcemap: false,
             // Single-bundle output. `codeSplitting: false` replaces the
             // deprecated `inlineDynamicImports: true`.

package/lib/app/gjs.js

@@ -95,7 +95,6 @@ export const setupForGjs = async (input) => {
         output: {
             ...input.output,
             format,
-            minify: false,
             sourcemap: false,
             // App builds emit a single bundle file. Disable code-splitting
             // so dynamic imports get inlined and the entire program lands
@@ -122,7 +121,11 @@ export const setupForGjs = async (input) => {
         }),
         blueprintPlugin(),
         deepkitPlugin({ reflection: input.pluginOptions.reflection }),
-        cssAsStringPlugin(),
+        // GTK4's CSS engine is much older than browser engines — its
+        // parser predates nesting + many modern selectors. Targeting
+        // `firefox: 60 << 16` makes lightningcss flatten the source
+        // into the subset GTK4 understands.
+        cssAsStringPlugin({ targets: { firefox: 60 << 16 } }),
         nodeModulesPathRewritePlugin({ bundleDir }),
         processStubPlugin({ userBanner: input.userBanner }),
         // resolveShebangLine returns null when disabled (false/undefined) and

package/lib/app/node.js

@@ -75,7 +75,6 @@ export const setupForNode = async (input) => {
         output: {
             ...input.output,
             format,
-            minify: false,
             sourcemap: false,
             banner,
             // Single-bundle output. `codeSplitting: false` replaces the

package/lib/library/lib.js

@@ -58,7 +58,6 @@ export const setupLib = async (input) => {
             // Rolldown keeps the full project-relative path. The root is
             // computed from the common ancestor of resolved entries.
             preserveModulesRoot,
-            minify: false,
             sourcemap: false,
         },
         treeshake: false,

package/lib/plugins/css-as-string.d.ts

@@ -1,2 +1,19 @@
 import type { Plugin } from 'rolldown';
-export declare function cssAsStringPlugin(): Plugin;
+export interface CssAsStringOptions {
+    /**
+     * lightningcss browser targets passed to `bundleAsync`. When set,
+     * nesting + modern syntax are lowered for the given engines. The
+     * GJS orchestrator defaults this to `{ firefox: 60 << 16 }` to
+     * match the GTK4 CSS parser. Omit or leave undefined to skip
+     * lowering (output stays as-authored except for `@import` inlining).
+     */
+    targets?: import('lightningcss').Targets;
+    /**
+     * When true (default), `@import` statements are resolved by
+     * lightningcss `bundleAsync`. Set false to fall back to a plain
+     * `readFile` — useful only when you want to keep `@import` strings
+     * verbatim in the bundled JS (rare).
+     */
+    bundle?: boolean;
+}
+export declare function cssAsStringPlugin(options?: CssAsStringOptions): Plugin;

package/lib/plugins/css-as-string.js

@@ -12,18 +12,27 @@
 //
 // — the canonical pattern for `Gtk.CssProvider` under GJS.
 //
-// `@import` resolution is left to the user / CSS preprocessor. For simple
-// app CSS this is fine; for @import-heavy CSS, run a preprocessor (e.g.
-// sass / postcss) ahead of `gjsify build` so the input file is already
-// flat.
+// `@import` resolution + nesting/modern-syntax lowering are handled via
+// lightningcss `bundleAsync`. The defaults work for the common case
+// (resolve `@import`s, no targeting); the `--app gjs` orchestrator passes
+// `targets: { firefox: 60 << 16 }` so nesting + modern selectors get
+// flattened to GTK4-CSS-engine-compatible output. Targeting is opt-in —
+// a missing `targets` keeps the source pristine.
+//
+// `lightningcss` is a regular dependency of this package; the plugin
+// imports it lazily so missing-arch installs surface the underlying
+// load error instead of crashing every gjsify build.
 import { readFile } from 'node:fs/promises';
-export function cssAsStringPlugin() {
+export function cssAsStringPlugin(options = {}) {
+    const { targets, bundle = true } = options;
     return {
         name: 'gjsify-css-as-string',
         load: {
             filter: { id: /\.css$/ },
             async handler(id) {
-                const code = await readFile(id, 'utf8');
+                const code = bundle
+                    ? new TextDecoder('utf-8').decode(await loadAndBundleCss(id, targets))
+                    : await readFile(id, 'utf8');
                 return {
                     code: `export default ${JSON.stringify(code)};`,
                     moduleType: 'js',
@@ -32,3 +41,13 @@ export function cssAsStringPlugin() {
         },
     };
 }
+async function loadAndBundleCss(filename, targets) {
+    const { bundleAsync } = await import('lightningcss');
+    const result = await bundleAsync({
+        filename,
+        targets,
+        minify: false,
+        errorRecovery: true,
+    });
+    return result.code;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gjsify/rolldown-plugin-gjsify",
-  "version": "0.3.15",
+  "version": "0.3.17",
   "description": "Rolldown / Rollup / Vite plugin orchestrator for GJS, Node, and Browser targets",
   "type": "module",
   "main": "lib/index.js",
@@ -42,13 +42,13 @@
   ],
   "license": "MIT",
   "dependencies": {
-    "@gjsify/resolve-npm": "^0.3.15",
-    "@gjsify/rolldown-plugin-deepkit": "^0.3.15",
-    "@gjsify/rolldown-plugin-pnp": "^0.3.15",
-    "@gjsify/vite-plugin-blueprint": "^0.3.15",
-    "@rollup/pluginutils": "^5.1.4",
-    "acorn": "^8.14.0",
-    "acorn-walk": "^8.3.4",
+    "@gjsify/resolve-npm": "^0.3.17",
+    "@gjsify/rolldown-plugin-deepkit": "^0.3.17",
+    "@gjsify/rolldown-plugin-pnp": "^0.3.17",
+    "@gjsify/vite-plugin-blueprint": "^0.3.17",
+    "@rollup/pluginutils": "^5.3.0",
+    "acorn": "^8.16.0",
+    "acorn-walk": "^8.3.5",
     "fast-glob": "^3.3.3",
     "lightningcss": "^1.32.0"
   },
@@ -61,8 +61,8 @@
     }
   },
   "devDependencies": {
-    "@types/node": "^25.6.0",
-    "rolldown": "^1.0.0-rc.18",
+    "@types/node": "^25.6.2",
+    "rolldown": "^1.0.0",
     "typescript": "^6.0.3"
   }
 }

package/src/app/browser.ts

@@ -73,7 +73,6 @@ export const setupForBrowser = async (input: BrowserFactoryInput): Promise<Brows
         output: {
             ...input.output,
             format: 'esm',
-            minify: false,
             sourcemap: false,
             // Single-bundle output. `codeSplitting: false` replaces the
             // deprecated `inlineDynamicImports: true`.

package/src/app/gjs.ts

@@ -136,7 +136,6 @@ export const setupForGjs = async (input: GjsFactoryInput): Promise<GjsBuildConfi
         output: {
             ...input.output,
             format,
-            minify: false,
             sourcemap: false,
             // App builds emit a single bundle file. Disable code-splitting
             // so dynamic imports get inlined and the entire program lands
@@ -165,7 +164,11 @@ export const setupForGjs = async (input: GjsFactoryInput): Promise<GjsBuildConfi
         }),
         blueprintPlugin() as RolldownPluginOption,
         deepkitPlugin({ reflection: input.pluginOptions.reflection }),
-        cssAsStringPlugin(),
+        // GTK4's CSS engine is much older than browser engines — its
+        // parser predates nesting + many modern selectors. Targeting
+        // `firefox: 60 << 16` makes lightningcss flatten the source
+        // into the subset GTK4 understands.
+        cssAsStringPlugin({ targets: { firefox: 60 << 16 } }),
         nodeModulesPathRewritePlugin({ bundleDir }),
         processStubPlugin({ userBanner: input.userBanner }),
         // resolveShebangLine returns null when disabled (false/undefined) and

package/src/app/node.ts

@@ -99,7 +99,6 @@ export const setupForNode = async (input: NodeFactoryInput): Promise<NodeBuildCo
         output: {
             ...input.output,
             format,
-            minify: false,
             sourcemap: false,
             banner,
             // Single-bundle output. `codeSplitting: false` replaces the

package/src/library/lib.ts

@@ -79,7 +79,6 @@ export const setupLib = async (input: LibFactoryInput): Promise<LibBuildConfig>
             // Rolldown keeps the full project-relative path. The root is
             // computed from the common ancestor of resolved entries.
             preserveModulesRoot,
-            minify: false,
             sourcemap: false,
         },
         treeshake: false,

package/src/plugins/css-as-string.ts

@@ -12,21 +12,48 @@
 //
 // — the canonical pattern for `Gtk.CssProvider` under GJS.
 //
-// `@import` resolution is left to the user / CSS preprocessor. For simple
-// app CSS this is fine; for @import-heavy CSS, run a preprocessor (e.g.
-// sass / postcss) ahead of `gjsify build` so the input file is already
-// flat.
+// `@import` resolution + nesting/modern-syntax lowering are handled via
+// lightningcss `bundleAsync`. The defaults work for the common case
+// (resolve `@import`s, no targeting); the `--app gjs` orchestrator passes
+// `targets: { firefox: 60 << 16 }` so nesting + modern selectors get
+// flattened to GTK4-CSS-engine-compatible output. Targeting is opt-in —
+// a missing `targets` keeps the source pristine.
+//
+// `lightningcss` is a regular dependency of this package; the plugin
+// imports it lazily so missing-arch installs surface the underlying
+// load error instead of crashing every gjsify build.
 
 import { readFile } from 'node:fs/promises';
 import type { Plugin } from 'rolldown';
 
-export function cssAsStringPlugin(): Plugin {
+export interface CssAsStringOptions {
+    /**
+     * lightningcss browser targets passed to `bundleAsync`. When set,
+     * nesting + modern syntax are lowered for the given engines. The
+     * GJS orchestrator defaults this to `{ firefox: 60 << 16 }` to
+     * match the GTK4 CSS parser. Omit or leave undefined to skip
+     * lowering (output stays as-authored except for `@import` inlining).
+     */
+    targets?: import('lightningcss').Targets;
+    /**
+     * When true (default), `@import` statements are resolved by
+     * lightningcss `bundleAsync`. Set false to fall back to a plain
+     * `readFile` — useful only when you want to keep `@import` strings
+     * verbatim in the bundled JS (rare).
+     */
+    bundle?: boolean;
+}
+
+export function cssAsStringPlugin(options: CssAsStringOptions = {}): Plugin {
+    const { targets, bundle = true } = options;
     return {
         name: 'gjsify-css-as-string',
         load: {
             filter: { id: /\.css$/ },
             async handler(id: string) {
-                const code = await readFile(id, 'utf8');
+                const code = bundle
+                    ? new TextDecoder('utf-8').decode(await loadAndBundleCss(id, targets))
+                    : await readFile(id, 'utf8');
                 return {
                     code: `export default ${JSON.stringify(code)};`,
                     moduleType: 'js' as const,
@@ -35,3 +62,17 @@ export function cssAsStringPlugin(): Plugin {
         },
     };
 }
+
+async function loadAndBundleCss(
+    filename: string,
+    targets: import('lightningcss').Targets | undefined,
+): Promise<Uint8Array> {
+    const { bundleAsync } = await import('lightningcss');
+    const result = await bundleAsync({
+        filename,
+        targets,
+        minify: false,
+        errorRecovery: true,
+    });
+    return result.code;
+}