domagic-turbopack-plugin 1.1.9

package/README.md

@@ -0,0 +1,106 @@
+# domagic-turbopack-plugin
+
+DOMagic 的 Next.js Turbopack 适配包，用于开发环境下给 React JSX/TSX 节点写入 DOMagic 定位信息，并通过独立本地服务处理 AI 样式修改和提交代码相关接口。
+
+> Turbopack 不支持 webpack plugin，所以这里不是 `new Plugin()` 形态，而是 `withDOMagicTurbopack()` + `domagic-turbopack-server`。
+
+## 安装
+
+```bash
+npm install -D domagic-turbopack-plugin
+```
+
+## 配置 Next
+
+```ts
+// next.config.ts
+import { withDOMagicTurbopack } from 'domagic-turbopack-plugin'
+
+export default withDOMagicTurbopack(
+  {
+    // 你的原 Next config
+  },
+  {
+    pathMode: 'relative',
+  },
+)
+```
+
+如果你的 `next.config.js` 还是 CommonJS，可以用动态 import：
+
+```js
+// next.config.js
+module.exports = async () => {
+  const { withDOMagicTurbopack } = await import('domagic-turbopack-plugin')
+
+  return withDOMagicTurbopack(
+    {
+      // 你的原 Next config
+    },
+    {
+      pathMode: 'relative',
+    },
+  )
+}
+```
+
+## 启动
+
+开两个终端：
+
+```bash
+npx domagic-turbopack-server \
+  --provider codex \
+  --cwd "$PWD" \
+  --command "/你的/codex/绝对路径"
+```
+
+```bash
+npx next dev --turbopack
+```
+
+默认 DOMagic 服务地址是：
+
+```text
+http://127.0.0.1:32183
+```
+
+如果你想换端口：
+
+```bash
+npx domagic-turbopack-server --port 42183
+```
+
+同时在 Next 配置里保持一致：
+
+```ts
+export default withDOMagicTurbopack(
+  {},
+  {
+    server: {
+      port: 42183,
+    },
+  },
+)
+```
+
+## 支持范围
+
+- 支持 Next.js Turbopack 的 `.tsx` / `.jsx` React 文件。
+- 内部复用 DOMagic 核心能力，业务项目只需要安装 `domagic-turbopack-plugin`。
+- 通过 Next rewrites 把 `/__domagic__/*` 转发到本地 DOMagic sidecar 服务。
+- 不支持 Vue 文件。Vue 场景继续用 Vite/Webpack 适配包更合适。
+
+## 注意
+
+Turbopack 当前不支持 webpack plugins，也不使用 `HtmlWebpackPlugin`。因此 DOMagic runtime 是通过 loader 注入到开发产物里的，并用全局标记避免重复初始化。
+
+一般不需要在业务代码里手动引入 runtime。如果你确实有自定义注入场景，请从 Turbopack 包自己的入口引入：
+
+```ts
+import { createOverlayRuntimeScript } from 'domagic-turbopack-plugin/runtime'
+```
+
+不要在 Turbopack 项目里直接引用 `domagic-vite-plugin/runtime`。
+
+DOMagic 默认只在开发环境启用，`next build` / `NODE_ENV=production` 时会自动跳过，不会影响线上生产包。

package/dist/cli.d.ts

@@ -0,0 +1,2 @@
+#!/usr/bin/env node
+export {};

package/dist/cli.js

@@ -0,0 +1,51 @@
+#!/usr/bin/env node
+import { startDomagicTurbopackServer } from './server.js';
+const port = parseNumberArg('--port') ?? parseNumberEnv('DOMAGIC_TURBOPACK_PORT');
+const host = parseStringArg('--host') ?? process.env.DOMAGIC_TURBOPACK_HOST;
+startDomagicTurbopackServer({
+    host,
+    port,
+    agent: {
+        provider: parseProviderArg('--provider') ?? parseProviderEnv('DOMAGIC_AGENT_PROVIDER'),
+        command: parseStringArg('--command'),
+        cwd: parseStringArg('--cwd'),
+    },
+});
+function parseNumberArg(name) {
+    const index = process.argv.indexOf(name);
+    const value = index >= 0 ? process.argv[index + 1] : undefined;
+    if (!value) {
+        return;
+    }
+    const parsed = Number(value);
+    return Number.isFinite(parsed) ? parsed : undefined;
+}
+function parseStringArg(name) {
+    const index = process.argv.indexOf(name);
+    const value = index >= 0 ? process.argv[index + 1] : undefined;
+    return value?.trim() || undefined;
+}
+function parseProviderArg(name) {
+    return parseProviderValue(parseStringArg(name));
+}
+function parseProviderEnv(name) {
+    return parseProviderValue(process.env[name]);
+}
+function parseProviderValue(value) {
+    const provider = value?.trim();
+    if (provider === 'codex' ||
+        provider === 'claude-code' ||
+        provider === 'gemini' ||
+        provider === 'generic-cli') {
+        return provider;
+    }
+    return undefined;
+}
+function parseNumberEnv(name) {
+    const value = process.env[name];
+    if (!value) {
+        return;
+    }
+    const parsed = Number(value);
+    return Number.isFinite(parsed) ? parsed : undefined;
+}

package/dist/index.d.ts

@@ -0,0 +1,35 @@
+import type { DomagicOptions } from 'domagic-vite-plugin/options';
+export type DOMagicTurbopackOptions = Pick<DomagicOptions, 'pathMode' | 'root'> & {
+    enabled?: boolean;
+    server?: {
+        host?: string;
+        port?: number;
+        url?: string;
+    };
+};
+type Rewrite = {
+    source: string;
+    destination: string;
+};
+type RewriteConfig = Rewrite[] | {
+    beforeFiles?: Rewrite[];
+    afterFiles?: Rewrite[];
+    fallback?: Rewrite[];
+};
+type NextConfig = {
+    turbopack?: {
+        rules?: Record<string, unknown>;
+        [key: string]: unknown;
+    };
+    experimental?: {
+        [key: string]: unknown;
+    };
+    compiler?: {
+        define?: Record<string, unknown>;
+        [key: string]: unknown;
+    };
+    rewrites?: (...args: unknown[]) => Promise<RewriteConfig> | RewriteConfig;
+    [key: string]: unknown;
+};
+export declare function withDOMagicTurbopack<TConfig extends NextConfig>(nextConfig?: TConfig, options?: DOMagicTurbopackOptions): TConfig;
+export {};

package/dist/index.js

@@ -0,0 +1,90 @@
+import { fileURLToPath } from 'node:url';
+const DEFAULT_SERVER_HOST = '127.0.0.1';
+const DEFAULT_SERVER_PORT = 32183;
+export function withDOMagicTurbopack(nextConfig = {}, options = {}) {
+    if (options.enabled === false || isProductionBuild()) {
+        return nextConfig;
+    }
+    const root = options.root ?? process.cwd();
+    const loader = resolveLoaderPath();
+    const loaderOptions = {
+        pathMode: options.pathMode,
+        root,
+        injectRuntime: true,
+    };
+    const domagicRules = {
+        '*.tsx': createRule(loader, loaderOptions),
+        '*.jsx': createRule(loader, loaderOptions),
+    };
+    const previousRewrites = nextConfig.rewrites;
+    const domagicRewrite = createDomagicRewrite(options);
+    const nextTurbopack = {
+        ...(nextConfig.turbopack ?? {}),
+        rules: {
+            ...(nextConfig.turbopack?.rules ?? {}),
+            ...domagicRules,
+        },
+    };
+    return {
+        ...nextConfig,
+        compiler: normalizeCompilerConfig(nextConfig.compiler),
+        turbopack: nextTurbopack,
+        async rewrites(...args) {
+            const current = previousRewrites ? await previousRewrites(...args) : [];
+            return mergeRewrites(current, domagicRewrite);
+        },
+    };
+}
+function createRule(loader, options) {
+    return {
+        loaders: [
+            {
+                loader,
+                options,
+            },
+        ],
+    };
+}
+function normalizeCompilerConfig(compiler) {
+    if (!compiler?.define) {
+        return compiler;
+    }
+    return {
+        ...compiler,
+        define: Object.fromEntries(Object.entries(compiler.define).map(([key, value]) => [
+            key,
+            typeof value === 'string' ? value : JSON.stringify(value),
+        ])),
+    };
+}
+function createDomagicRewrite(options) {
+    return {
+        source: '/__domagic__/:path*',
+        destination: `${resolveServerUrl(options)}/__domagic__/:path*`,
+    };
+}
+function resolveServerUrl(options) {
+    if (options.server?.url) {
+        return options.server.url.replace(/\/$/, '');
+    }
+    const host = options.server?.host ?? DEFAULT_SERVER_HOST;
+    const port = options.server?.port ?? DEFAULT_SERVER_PORT;
+    return `http://${host}:${port}`;
+}
+function mergeRewrites(current, domagicRewrite) {
+    if (Array.isArray(current)) {
+        return [domagicRewrite, ...current];
+    }
+    return {
+        beforeFiles: [domagicRewrite, ...(current.beforeFiles ?? [])],
+        afterFiles: current.afterFiles ?? [],
+        fallback: current.fallback ?? [],
+    };
+}
+function resolveLoaderPath() {
+    return fileURLToPath(new URL('./loader.js', import.meta.url));
+}
+function isProductionBuild() {
+    return (process.env.NODE_ENV === 'production' ||
+        process.env.NEXT_PHASE === 'phase-production-build');
+}

package/dist/loader.d.ts

@@ -0,0 +1,15 @@
+import type { DomagicOptions } from 'domagic-vite-plugin/options';
+type LoaderCallback = (error: Error | null, content?: string, sourceMap?: unknown) => void;
+type LoaderContext = {
+    resourcePath: string;
+    rootContext?: string;
+    async?: () => LoaderCallback;
+    callback?: LoaderCallback;
+    getOptions?: () => DOMagicTurbopackLoaderOptions;
+};
+export type DOMagicTurbopackLoaderOptions = DomagicOptions & {
+    injectRuntime?: boolean;
+};
+export declare function transformTurbopackSource(source: string, resourcePath: string, options?: DOMagicTurbopackLoaderOptions, root?: string): string;
+export default function domagicTurbopackLoader(this: LoaderContext, source: string, sourceMap?: unknown): string | void;
+export {};

package/dist/loader.js

@@ -0,0 +1,42 @@
+import { formatDomagicFile } from 'domagic-vite-plugin/options';
+import { transformReactSource } from 'domagic-vite-plugin/react-transform';
+import { createOverlayRuntimeScript } from './runtime.js';
+export function transformTurbopackSource(source, resourcePath, options = {}, root = process.cwd()) {
+    return transformTurbopackSourceWithMap(source, resourcePath, options, root).code;
+}
+function transformTurbopackSourceWithMap(source, resourcePath, options = {}, root = process.cwd(), sourceMap) {
+    const fileValue = formatDomagicFile(resourcePath, options, options.root ?? root);
+    const transformed = /\.[jt]sx$/.test(resourcePath)
+        ? transformReactSource(source, fileValue)?.code ?? source
+        : source;
+    const sourceWithRuntime = options.injectRuntime
+        ? appendRuntimeGuard(transformed)
+        : transformed;
+    return {
+        code: sourceWithRuntime,
+        sourceMap,
+    };
+}
+export default function domagicTurbopackLoader(source, sourceMap) {
+    const options = this.getOptions?.() ?? {};
+    const root = options.root ?? this.rootContext ?? process.cwd();
+    const transformed = transformTurbopackSourceWithMap(source, this.resourcePath, options, root, sourceMap);
+    const callback = this.async?.() ?? this.callback;
+    if (callback) {
+        callback(null, transformed.code, transformed.sourceMap);
+        return;
+    }
+    return transformed.code;
+}
+function appendRuntimeGuard(source) {
+    return `${source}
+
+if (
+  typeof window !== 'undefined' &&
+  !window.__DOMAGIC_TURBOPACK_RUNTIME_INSTALLED__
+) {
+  window.__DOMAGIC_TURBOPACK_RUNTIME_INSTALLED__ = true;
+  ${createOverlayRuntimeScript()}
+}
+`;
+}

package/dist/runtime.d.ts

@@ -0,0 +1,4 @@
+export { DOMAGIC_EDIT_ENDPOINT, DOMAGIC_EDIT_STATUS_ENDPOINT, DOMAGIC_GIT_COMMIT_MESSAGE_ENDPOINT, DOMAGIC_GIT_COMMIT_PUSH_ENDPOINT, DOMAGIC_GIT_STATUS_ENDPOINT, DOMAGIC_REVIEW_ENDPOINT, DOMAGIC_REVIEW_STATUS_ENDPOINT, DOMAGIC_RUNTIME_SESSION_ENDPOINT, computeOverlayPosition, getTaskPollDelay, } from 'domagic-vite-plugin/runtime';
+import { type OverlayRuntimeOptions } from 'domagic-vite-plugin/runtime';
+export type { OverlayRuntimeOptions } from 'domagic-vite-plugin/runtime';
+export declare function createOverlayRuntimeScript(options?: OverlayRuntimeOptions): string;

package/dist/runtime.js

@@ -0,0 +1,8 @@
+export { DOMAGIC_EDIT_ENDPOINT, DOMAGIC_EDIT_STATUS_ENDPOINT, DOMAGIC_GIT_COMMIT_MESSAGE_ENDPOINT, DOMAGIC_GIT_COMMIT_PUSH_ENDPOINT, DOMAGIC_GIT_STATUS_ENDPOINT, DOMAGIC_REVIEW_ENDPOINT, DOMAGIC_REVIEW_STATUS_ENDPOINT, DOMAGIC_RUNTIME_SESSION_ENDPOINT, computeOverlayPosition, getTaskPollDelay, } from 'domagic-vite-plugin/runtime';
+import { createOverlayRuntimeScript as createBaseOverlayRuntimeScript, } from 'domagic-vite-plugin/runtime';
+export function createOverlayRuntimeScript(options = {}) {
+    return createBaseOverlayRuntimeScript({
+        reloadAfterStyleEdit: true,
+        ...options,
+    });
+}

package/dist/server.d.ts

@@ -0,0 +1,13 @@
+import { createServer, type IncomingMessage, type ServerResponse } from 'node:http';
+import type { DomagicAgentOptions } from 'domagic-vite-plugin/options';
+export type DOMagicTurbopackServerOptions = {
+    host?: string;
+    port?: number;
+    agent?: DomagicAgentOptions;
+    root?: string;
+};
+type ConnectNext = () => void;
+type ConnectMiddleware = (req: IncomingMessage, res: ServerResponse, next: ConnectNext) => void | Promise<void>;
+export declare function createDomagicTurbopackMiddleware(agentOptions?: DomagicAgentOptions, projectRoot?: string): ConnectMiddleware;
+export declare function startDomagicTurbopackServer(options?: DOMagicTurbopackServerOptions): ReturnType<typeof createServer>;
+export {};

package/dist/server.js

@@ -0,0 +1,45 @@
+import { createServer } from 'node:http';
+import { installStyleEditMiddlewareWithOptions } from 'domagic-vite-plugin/server';
+const DEFAULT_HOST = '127.0.0.1';
+const DEFAULT_PORT = 32183;
+export function createDomagicTurbopackMiddleware(agentOptions, projectRoot) {
+    const serverLike = {
+        middlewares: {
+            handlers: [],
+            use(handler) {
+                this.handlers.push(handler);
+            },
+        },
+    };
+    installStyleEditMiddlewareWithOptions(serverLike, agentOptions, projectRoot);
+    return withCors(serverLike.middlewares.handlers[0]);
+}
+export function startDomagicTurbopackServer(options = {}) {
+    const host = options.host ?? DEFAULT_HOST;
+    const port = options.port ?? DEFAULT_PORT;
+    const middleware = createDomagicTurbopackMiddleware(options.agent, options.root ?? options.agent?.cwd);
+    const server = createServer((req, res) => {
+        void middleware(req, res, () => {
+            res.statusCode = 404;
+            res.setHeader('Content-Type', 'application/json');
+            res.end(JSON.stringify({ ok: false, error: 'DOMagic endpoint not found' }));
+        });
+    });
+    server.listen(port, host, () => {
+        console.log(`[domagic] Turbopack server listening on http://${host}:${port}`);
+    });
+    return server;
+}
+function withCors(middleware) {
+    return (req, res, next) => {
+        res.setHeader('Access-Control-Allow-Origin', '*');
+        res.setHeader('Access-Control-Allow-Methods', 'GET,POST,OPTIONS');
+        res.setHeader('Access-Control-Allow-Headers', 'Content-Type');
+        if (req.method === 'OPTIONS') {
+            res.statusCode = 204;
+            res.end();
+            return;
+        }
+        return middleware(req, res, next);
+    };
+}

package/package.json

@@ -0,0 +1,62 @@
+{
+  "name": "domagic-turbopack-plugin",
+  "version": "1.1.9",
+  "description": "A development-only Turbopack adapter for DOM source mapping and AI-assisted style edits.",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./loader": {
+      "types": "./dist/loader.d.ts",
+      "import": "./dist/loader.js"
+    },
+    "./server": {
+      "types": "./dist/server.d.ts",
+      "import": "./dist/server.js"
+    },
+    "./runtime": {
+      "types": "./dist/runtime.d.ts",
+      "import": "./dist/runtime.js"
+    }
+  },
+  "bin": {
+    "domagic-turbopack-server": "dist/cli.js"
+  },
+  "files": [
+    "dist"
+  ],
+  "sideEffects": false,
+  "keywords": [
+    "turbopack",
+    "nextjs",
+    "dom",
+    "react",
+    "ai"
+  ],
+  "license": "UNLICENSED",
+  "publishConfig": {
+    "registry": "https://registry.npmjs.org/"
+  },
+  "scripts": {
+    "build": "tsc -p tsconfig.json",
+    "prepublishOnly": "npm run build && npm test",
+    "test": "vitest run --config vitest.config.ts"
+  },
+  "dependencies": {
+    "domagic-vite-plugin": "1.1.9",
+    "typescript": "^5.9.3"
+  },
+  "peerDependencies": {
+    "next": ">=15.3.0"
+  },
+  "devDependencies": {
+    "@types/node": "^24.12.0",
+    "typescript": "^5.9.3",
+    "vitest": "^3.2.4"
+  }
+}