@open-dy/vibecoding-sdk-taro 0.0.1-beta.5 → 0.0.1

package/src/build/plugins/vite-inline-json.ts

@@ -0,0 +1,149 @@
+import type { Plugin } from "vite";
+import fs from "fs";
+import path from "path";
+
+/**
+ * 将 `src/` 内 `import ... from '*.json'` 在 transform 阶段内联为 `const ... = {...}`。
+ *
+ * 背景：Taro H5 browser router 动态加载页面时，嵌套的 `.json` import 会触发
+ * `.json?import` 请求；云端预览环境可能返回 `application/json` 而非 JS 模块，
+ * 导致页面 import 失败、白屏。内联后可消除该运行时请求。
+ *
+ * 范围：src 目录下 ts/tsx/js/jsx 中的 @/ 或相对路径 .json import；enforce: pre。
+ * 业务上 Feed 落地页应走 `feed-card-from-json.ts`，不 runtime import JSON；本插件仍兜底 Agent 误写 import。
+ */
+
+// 匹配默认导入、命名导入、混合导入
+const JSON_IMPORT_RE =
+  /\bimport\s+([\w{},\s]+?)\s+from\s+['"]([^'"]+\.json)(?:\?[^\s'"]*)?['"]/g;
+
+export function viteInlineJsonPlugin(options: { projectRoot: string }): Plugin {
+  const srcDir = path.join(options.projectRoot, "src");
+
+  return {
+    name: "vite-inline-json",
+    enforce: "pre",
+
+    transform(code, id) {
+      const cleanId = id.split("?")[0]!;
+      if (
+        !/\.(tsx?|jsx?)$/.test(cleanId) ||
+        cleanId.includes("node_modules") ||
+        !cleanId.replace(/\\/g, "/").includes("/src/")
+      ) {
+        return null;
+      }
+
+      JSON_IMPORT_RE.lastIndex = 0;
+      if (!JSON_IMPORT_RE.test(code)) return null;
+      JSON_IMPORT_RE.lastIndex = 0;
+
+      const replacements: Array<{ start: number; end: number; text: string }> =
+        [];
+      let match: RegExpExecArray | null;
+
+      while ((match = JSON_IMPORT_RE.exec(code)) !== null) {
+        const [fullMatch, specifiers, importPath] = match;
+        const absPath = resolveJsonPath(importPath, cleanId, srcDir);
+        if (!absPath) continue;
+
+        let json: string;
+        try {
+          json = fs.readFileSync(absPath, "utf-8").trim();
+          JSON.parse(json);
+        } catch {
+          continue;
+        }
+
+        const text = expandSpecifiers(specifiers.trim(), json);
+        if (!text) continue;
+
+        replacements.push({
+          start: match.index,
+          end: match.index + fullMatch.length,
+          text,
+        });
+      }
+
+      if (replacements.length === 0) return null;
+
+      let result = code;
+      for (let i = replacements.length - 1; i >= 0; i--) {
+        const { start, end, text } = replacements[i]!;
+        result = result.slice(0, start) + text + result.slice(end);
+      }
+      return { code: result, map: null };
+    },
+  };
+}
+
+/**
+ * 将 import 说明符展开为 const 声明。
+ *
+ * 默认导入：  feedCard                       → const feedCard = <json>
+ * 命名导入：  { AppID, PlanName as name }     → const __json = <json>; const AppID = __json.AppID; ...
+ * 混合导入：  feedCard, { AppID }             → const feedCard = <json>; const AppID = feedCard.AppID;
+ */
+function expandSpecifiers(specifiers: string, json: string): string | null {
+  const mixed = specifiers.match(/^(\w+)\s*,\s*\{(.+)\}$/);
+  const named = specifiers.match(/^\{(.+)\}$/);
+  const defaultOnly = specifiers.match(/^(\w+)$/);
+
+  if (mixed) {
+    return `const ${mixed[1]} = ${json};\n${namedDecls(mixed[2]!, mixed[1])}`;
+  }
+  if (named) {
+    const tmp = `__json_${hash(specifiers)}`;
+    return `const ${tmp} = ${json};\n${namedDecls(named[1]!, tmp)}`;
+  }
+  if (defaultOnly) {
+    return `const ${defaultOnly[1]} = ${json}`;
+  }
+  return null;
+}
+
+/** 将 `{ foo, bar as baz }` 中的每一项展开为 `const xxx = obj.prop;` */
+function namedDecls(part: string, obj: string): string {
+  return (
+    part
+      .split(",")
+      .map((s) => s.trim())
+      .filter(Boolean)
+      .map((item) => {
+        const m = item.match(/^(\w+)(?:\s+as\s+(\w+))?$/);
+        if (!m) return null;
+        const alias = m[2] ?? m[1];
+        return `const ${alias} = ${obj}.${m[1]}`;
+      })
+      .filter((s): s is string => s !== null)
+      .join(";\n") + ";"
+  );
+}
+
+/** 简单哈希，用于生成唯一临时变量名 */
+function hash(s: string): string {
+  let h = 0;
+  for (let i = 0; i < s.length; i++) h = ((h << 5) - h + s.charCodeAt(i)) | 0;
+  return (h >>> 0).toString(36);
+}
+
+function resolveJsonPath(
+  importPath: string,
+  importerId: string,
+  srcDir: string,
+): string | null {
+  const resolved = importPath.startsWith("@/")
+    ? path.join(srcDir, importPath.slice(2))
+    : importPath.startsWith(".")
+      ? path.resolve(path.dirname(importerId), importPath)
+      : null;
+
+  if (!resolved) return null;
+  try {
+    if (fs.statSync(resolved).isFile() && resolved.endsWith(".json"))
+      return resolved;
+  } catch {
+    /* ignore */
+  }
+  return null;
+}

package/src/build/plugins/vite-taro-source-location.ts

@@ -0,0 +1,224 @@
+import generateModule from '@babel/generator'
+import { parse } from '@babel/parser'
+import traverseModule from '@babel/traverse'
+import * as t from '@babel/types'
+import { Buffer } from 'node:buffer'
+import path from 'node:path'
+
+interface TaroSourceLocationPlugin {
+  name: string
+  enforce: 'pre'
+  transform: (
+    code: string,
+    id: string,
+  ) => { code: string; map: unknown } | null
+}
+
+const TARO_COMPONENTS_MODULE = '@tarojs/components'
+const SOURCE_CLASS_PREFIX = '__ai_src_'
+const generate =
+  (generateModule as unknown as { default?: typeof generateModule }).default ?? generateModule
+const traverse =
+  (traverseModule as unknown as { default?: typeof traverseModule }).default ?? traverseModule
+
+const normalizePath = (value: string) => value.split(path.sep).join('/')
+const encodeSourceClass = (sourceFile: string, line: number, column: number) =>
+  `${SOURCE_CLASS_PREFIX}${Buffer.from(
+    JSON.stringify([sourceFile, line, column]),
+    'utf8',
+  ).toString('base64url')}`
+
+const createClassHelpers = (
+  mergeHelperName: string,
+  spreadHelperName: string,
+  includeSpreadHelper: boolean,
+) =>
+  parse(
+    `
+function ${mergeHelperName}(value, sourceClass) {
+  return value == null || value === false || value === ''
+    ? sourceClass
+    : String(value) + ' ' + sourceClass;
+}
+${includeSpreadHelper ? `
+function ${spreadHelperName}(value, sourceClass) {
+  if (
+    value == null ||
+    !Object.prototype.hasOwnProperty.call(Object(value), 'className')
+  ) {
+    return value;
+  }
+  const props = { ...value };
+  props.className = ${mergeHelperName}(props.className, sourceClass);
+  return props;
+}
+` : ''}
+`,
+    { sourceType: 'module' },
+  ).program.body
+
+const getAttributeName = (attribute: t.JSXAttribute | t.JSXSpreadAttribute) =>
+  t.isJSXAttribute(attribute) && t.isJSXIdentifier(attribute.name)
+    ? attribute.name.name
+    : ''
+
+const isInsideDirectory = (directory: string, filename: string) => {
+  const relative = path.relative(directory, filename)
+  return Boolean(relative) && !relative.startsWith('..') && !path.isAbsolute(relative)
+}
+
+export function viteTaroSourceLocationPlugin(options: {
+  enabled: boolean
+  projectRoot: string
+}): TaroSourceLocationPlugin {
+  const projectRoot = path.resolve(options.projectRoot)
+  const sourceRoot = path.join(projectRoot, 'src')
+
+  return {
+    name: 'taro-source-location',
+    enforce: 'pre',
+    transform(code, id) {
+      const filename = id.split('?')[0].split('#')[0]
+      if (
+        !options.enabled ||
+        !/\.[jt]sx$/.test(filename) ||
+        !isInsideDirectory(sourceRoot, filename)
+      ) {
+        return null
+      }
+
+      const ast = parse(code, {
+        sourceType: 'module',
+        sourceFilename: filename,
+        plugins: ['jsx', 'typescript', 'decorators-legacy', 'classProperties'],
+      })
+      const namedImports = new Set<string>()
+      const namespaceImports = new Set<string>()
+      let changed = false
+      let needsMergeHelper = false
+      let needsSpreadHelper = false
+      let mergeHelperName = ''
+      let spreadHelperName = ''
+
+      for (const statement of ast.program.body) {
+        if (
+          !t.isImportDeclaration(statement) ||
+          statement.source.value !== TARO_COMPONENTS_MODULE
+        ) {
+          continue
+        }
+        for (const specifier of statement.specifiers) {
+          if (t.isImportSpecifier(specifier)) {
+            namedImports.add(specifier.local.name)
+          } else if (t.isImportNamespaceSpecifier(specifier)) {
+            namespaceImports.add(specifier.local.name)
+          }
+        }
+      }
+
+      traverse(ast, {
+        Program(programPath) {
+          mergeHelperName = programPath.scope.generateUidIdentifier('aiSourceClass').name
+          spreadHelperName = programPath.scope.generateUidIdentifier('aiSourceProps').name
+        },
+        JSXOpeningElement(openingPath) {
+          const name = openingPath.node.name
+          const isNamedComponent =
+            t.isJSXIdentifier(name) && namedImports.has(name.name)
+          const isNamespaceComponent =
+            t.isJSXMemberExpression(name) &&
+            t.isJSXIdentifier(name.object) &&
+            namespaceImports.has(name.object.name)
+          if (!isNamedComponent && !isNamespaceComponent) {
+            return
+          }
+
+          const location = openingPath.node.loc?.start
+          if (!location) {
+            return
+          }
+          const sourceClass = encodeSourceClass(
+            normalizePath(path.relative(projectRoot, filename)),
+            location.line,
+            location.column + 1,
+          )
+          let hasExplicitClassName = false
+
+          for (const attribute of openingPath.node.attributes) {
+            if (t.isJSXSpreadAttribute(attribute)) {
+              attribute.argument = t.callExpression(t.identifier(spreadHelperName), [
+                attribute.argument,
+                t.stringLiteral(sourceClass),
+              ])
+              needsMergeHelper = true
+              needsSpreadHelper = true
+              continue
+            }
+            if (getAttributeName(attribute) !== 'className') {
+              continue
+            }
+
+            hasExplicitClassName = true
+            if (t.isStringLiteral(attribute.value)) {
+              attribute.value = t.stringLiteral(
+                attribute.value.value
+                  ? `${attribute.value.value} ${sourceClass}`
+                  : sourceClass,
+              )
+              continue
+            }
+
+            const classExpression = t.isJSXExpressionContainer(attribute.value)
+              ? attribute.value.expression
+              : attribute.value
+            if (!classExpression || t.isJSXEmptyExpression(classExpression)) {
+              attribute.value = t.stringLiteral(sourceClass)
+              continue
+            }
+            attribute.value = t.jsxExpressionContainer(
+              t.callExpression(t.identifier(mergeHelperName), [
+                classExpression,
+                t.stringLiteral(sourceClass),
+              ]),
+            )
+            needsMergeHelper = true
+          }
+
+          if (!hasExplicitClassName) {
+            openingPath.node.attributes.unshift(
+              t.jsxAttribute(t.jsxIdentifier('className'), t.stringLiteral(sourceClass)),
+            )
+          }
+          changed = true
+        },
+      })
+
+      if (!changed) {
+        return null
+      }
+      if (needsMergeHelper) {
+        const helpers = createClassHelpers(
+          mergeHelperName,
+          spreadHelperName,
+          needsSpreadHelper,
+        )
+        let insertionIndex = 0
+        for (let index = 0; index < ast.program.body.length; index += 1) {
+          if (t.isImportDeclaration(ast.program.body[index])) {
+            insertionIndex = index + 1
+          }
+        }
+        ast.program.body.splice(insertionIndex, 0, ...helpers)
+      }
+      const output = generate(
+        ast,
+        {
+          sourceMaps: true,
+          sourceFileName: normalizePath(path.relative(projectRoot, filename)),
+        },
+        code,
+      )
+      return { code: output.code, map: output.map }
+    },
+  }
+}

package/src/build/plugins/vite-tt-components-entry.ts

@@ -0,0 +1,33 @@
+import type { Plugin } from 'vite'
+
+/**
+ * Keep TT's component barrels outside Taro's development React alias.
+ * Taro can resolve these entries directly or through @tarojs/components.
+ * plugin-inject also writes an extensionless export-star before bundling its
+ * generated barrel; protect that transitive import as well as the entry itself.
+ * Its /.*react$/ alias otherwise treats the extensionless barrels as React,
+ * making native components such as View and Text undefined.
+ */
+export function viteTtComponentsEntryPlugin(): Plugin {
+  return {
+    name: 'vibecoding-tt-components-entry',
+    // Add the exact entries after Taro has configured its React aliases.
+    enforce: 'post',
+    config() {
+      return {
+        resolve: {
+          alias: [
+            {
+              find: /^@tarojs\/plugin-platform-tt\/dist\/components-react$/,
+              replacement: '@tarojs/plugin-platform-tt/dist/components-react.js',
+            },
+            {
+              find: /^@tarojs\/plugin-inject\/dist\/components-react$/,
+              replacement: '@tarojs/plugin-inject/dist/components-react.js',
+            },
+          ],
+        },
+      }
+    },
+  }
+}