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

package/src/eslint/server.mjs

@@ -0,0 +1,69 @@
+import { createHash } from 'node:crypto';
+import { readFileSync } from 'node:fs';
+import path from 'node:path';
+import eslint from '@eslint/js';
+import importPlugin from 'eslint-plugin-import';
+import globals from 'globals';
+import tseslint from 'typescript-eslint';
+
+export function createMicroappServerEslintConfig(options = {}) {
+  const serverRoot = path.resolve(options.tsconfigRootDir ?? process.cwd());
+  const dependencyManifestFingerprint = createHash('sha256')
+    .update(readFileSync(path.resolve(serverRoot, '../package.json')))
+    .update('\0')
+    .update(readFileSync(path.resolve(serverRoot, 'package.json')))
+    .digest('hex');
+  const defaults = tseslint.config(
+    {
+      ignores: ['eslint.config.mjs'],
+    },
+    eslint.configs.recommended,
+    ...tseslint.configs.recommendedTypeChecked,
+    {
+      languageOptions: {
+        globals: {
+          ...globals.node,
+          ...globals.jest,
+        },
+        sourceType: 'commonjs',
+        parserOptions: {
+          projectService: true,
+          tsconfigRootDir: serverRoot,
+        },
+      },
+    },
+    {
+      settings: {
+        'microapp/dependency-manifest-fingerprint': dependencyManifestFingerprint,
+      },
+      plugins: {
+        import: importPlugin,
+      },
+      rules: {
+        'import/no-extraneous-dependencies': [
+          'error',
+          {
+            includeTypes: true,
+            packageDir: serverRoot,
+          },
+        ],
+        '@typescript-eslint/no-explicit-any': 'off',
+        '@typescript-eslint/no-floating-promises': 'warn',
+        '@typescript-eslint/no-unsafe-argument': 'off',
+        '@typescript-eslint/no-unsafe-assignment': 'off',
+        '@typescript-eslint/no-unsafe-member-access': 'off',
+        '@typescript-eslint/no-unsafe-call': 'off',
+        '@typescript-eslint/no-unsafe-return': 'off',
+        '@typescript-eslint/no-unused-vars': 'off',
+        '@typescript-eslint/require-await': 'off',
+        '@typescript-eslint/no-redundant-type-constituents': 'off',
+      },
+    },
+  );
+  const overrides = options.overrides;
+  if (!overrides) return defaults;
+  if (typeof overrides === 'function') return overrides(defaults) ?? defaults;
+  return tseslint.config(...defaults, ...(Array.isArray(overrides) ? overrides : [overrides]));
+}
+
+export default createMicroappServerEslintConfig

package/src/eslint/taro.mjs

@@ -0,0 +1,553 @@
+import eslint from '@eslint/js';
+import { fixupPluginRules } from '@eslint/compat';
+import tseslint from 'typescript-eslint';
+import reactPlugin from 'eslint-plugin-react';
+import reactHooksPlugin from 'eslint-plugin-react-hooks';
+import importPlugin from 'eslint-plugin-import';
+import globals from 'globals';
+import microappPages from './eslint-plugin-microapp-pages.mjs';
+
+const REMOTE_CSS_IMPORT_PATTERN =
+  /@import\s+(?:url\(\s*['"]?((?:https?:)?\/\/[^'")\s]+)['"]?\s*\)|['"]((?:https?:)?\/\/[^'"\s]+)['"])/g;
+const CSS_FONT_SIZE_DECLARATION_PATTERN =
+  /(?:^|[;{\s])font-size\s*:\s*([^;{}]+)/gi;
+
+/**
+ * 检测项目选定的 Lucide Taro 包导入的图标是否显式传了 color 属性。
+ * 小程序端图标通过 base64 SVG + <Image /> 渲染，无法继承 currentColor 或 CSS text-* 颜色，
+ * 未传 color 时笔画默认为黑色。
+ */
+function createLucideColorCheckPlugin(importSources = ['@open-dy/lucide-taro']) {
+  const sources = new Set(
+    (Array.isArray(importSources) ? importSources : [importSources])
+      .filter((source) => typeof source === 'string' && source.length > 0),
+  )
+  const label = [...sources].join(' / ') || '@open-dy/lucide-taro'
+
+  return {
+    rules: {
+      'require-lucide-color': {
+        create(context) {
+          const lucideImports = new Set();
+
+        return {
+          ImportDeclaration(node) {
+            if (sources.has(node.source.value)) {
+              for (const specifier of node.specifiers) {
+                if (specifier.type === 'ImportSpecifier') {
+                  lucideImports.add(specifier.local.name);
+                }
+              }
+            }
+          },
+          JSXOpeningElement(node) {
+            const name =
+              node.name.type === 'JSXIdentifier' ? node.name.name : null;
+            if (!name || !lucideImports.has(name)) return;
+
+            const hasColor = node.attributes.some(
+              attr =>
+                attr.type === 'JSXAttribute' &&
+                attr.name &&
+                attr.name.name === 'color'
+            );
+
+            if (!hasColor) {
+              context.report({
+                node,
+                message: `${label} 规范：<${name}> 缺少 color 属性。小程序端图标通过 <Image /> 渲染，无法继承父级颜色，未传 color 时笔画默认为黑色。请显式传入，如 color="#6366f1"。`,
+              });
+            }
+          },
+        };
+        },
+      },
+    },
+  }
+}
+
+const cssImportGuardPlugin = {
+  processors: {
+    css: {
+      preprocess(text) {
+        const lines = text.replace(/\/\*[\s\S]*?\*\//g, comment => {
+          if (comment.includes('eslint-')) return comment;
+          return comment.replace(/[^\n]/g, ' ');
+        }).split('\n');
+        const virtualLines = lines.map(line => {
+          const externalImportCalls = [...line.matchAll(REMOTE_CSS_IMPORT_PATTERN)]
+            .map(match => {
+              const url = match[1] ?? match[2];
+
+              return `__cssExternalImport(${JSON.stringify(url)});`;
+            });
+
+          const arbitraryFontSizeCalls = [...line.matchAll(CSS_FONT_SIZE_DECLARATION_PATTERN)]
+            .map(match => match[1].trim())
+            .filter(isArbitraryFontSizeValue)
+            .map(value => `__cssArbitraryFontSize(${JSON.stringify(value)});`);
+
+          if (/eslint-(?:disable|enable)/.test(line)) {
+            return [
+              line.trim(),
+              ...externalImportCalls,
+              ...arbitraryFontSizeCalls,
+            ].join(' ');
+          }
+
+          return [
+            ...externalImportCalls,
+            ...arbitraryFontSizeCalls,
+          ].join(' ');
+        });
+
+        return [virtualLines.join('\n')];
+      },
+      postprocess(messages) {
+        return messages.flat();
+      },
+      supportsAutofix: false,
+    },
+  },
+};
+
+function isArbitraryFontSizeValue(value) {
+  const normalized = value
+    .replace(/\s*!important\s*$/i, '')
+    .trim();
+
+  return ARBITRARY_FONT_SIZE_VALUE_PATTERN.test(normalized);
+}
+
+const baseRestrictedSyntaxRules = [
+  {
+    selector: "CallExpression[callee.name='require']",
+    message:
+      "工程规范：前端 src 目录使用 ES Module，禁止使用 require()",
+  },
+  {
+    selector: "MemberExpression[object.name='process'][property.name='env']",
+    message:
+      '工程规范：请勿在 src 目录下直接使用 process.env\n如需获取 URL 请求前缀，请使用已经注入全局的 PROJECT_DOMAIN',
+  },
+  {
+    selector:
+      ":matches(ExportNamedDeclaration, ExportDefaultDeclaration) :matches([id.name='Network'], [declaration.id.name='Network'])",
+    message:
+      "工程规范：禁止自行定义 Network，项目已提供 src/network.ts，请直接使用: import { Network } from '@/network'",
+  },
+  {
+    selector:
+      "CallExpression[callee.name='__cssExternalImport'] > Literal[value=/^(?:https?:)?\\/\\//]",
+    message:
+      '抖音小程序兼容性：禁止在 CSS/TTSS 中使用远程 @import（如 Google Fonts）。请改为本地静态资源或删除该导入。',
+  },
+  {
+    selector:
+      "JSXAttribute[name.name='color'][value.type='Literal'][value.value='currentColor'], JSXAttribute[name.name='color'] > JSXExpressionContainer > Literal[value='currentColor']",
+    message:
+      '图标组件规范：禁止使用 color="currentColor"，小程序端不会按预期继承颜色。请改为显式颜色值，或通过 LucideProvider 提供默认颜色。',
+  },
+  {
+    selector:
+      "ImportDeclaration[source.value='@tarojs/taro'] > ImportSpecifier[imported.name='Taro']",
+    message:
+      "Taro 导入规范：禁止 `import { Taro } from '@tarojs/taro'`。前端 tsconfig 未开启 esModuleInterop，tsc 会报 TS2596。请使用默认导入：`import Taro from '@tarojs/taro'`；需要 Hook 时写成 `import Taro, { useDidShow } from '@tarojs/taro'`。",
+  },
+  {
+    selector:
+      "ImportDeclaration[source.value='@tarojs/taro'] > ImportNamespaceSpecifier",
+    message:
+      "Taro 导入规范：禁止 `import * as Taro from '@tarojs/taro'`。请使用默认导入：`import Taro from '@tarojs/taro'`。",
+  },
+];
+
+function createPageRestrictedSyntaxRules(
+  preferredUiImportBase = '@open-dy/vibecoding-sdk-taro/ui',
+) {
+  return [
+    ['Button', 'button'],
+    ['Input', 'input'],
+    ['Textarea', 'textarea'],
+    ['Label', 'label'],
+    ['Switch', 'switch'],
+    ['Slider', 'slider'],
+    ['Progress', 'progress'],
+  ].map(([component, module]) => ({
+    selector:
+      `ImportDeclaration[source.value='@tarojs/components'] ImportSpecifier[imported.name='${component}']`,
+    message:
+      `组件规范：${component} 优先使用 '${preferredUiImportBase}/${module}'，` +
+      `不要在页面中直接使用 '@tarojs/components' 的 ${component}。`,
+  }))
+}
+
+const ARBITRARY_FONT_SIZE_CLASS_PATTERN =
+  /^(?:!)?text-\[(?:length:)?(?:(?:\d+(?:\.\d+)?|\.\d+)(?:px|rpx|rem|em|vw|vh)|calc\([^\]]+\)|clamp\([^\]]+\)|min\([^\]]+\)|max\([^\]]+\))(?:\/[^\]]+)?\]$/;
+const ARBITRARY_FONT_SIZE_VALUE_PATTERN =
+  /^(?:(?:\d+(?:\.\d+)?|\.\d+)(?:px|rpx|rem|em|vw|vh)|calc\([^)]+\)|clamp\([^)]+\)|min\([^)]+\)|max\([^)]+\))$/i;
+
+function splitTailwindClassToken(token) {
+  let bracketDepth = 0;
+  let lastSeparatorIndex = -1;
+
+  for (let index = 0; index < token.length; index += 1) {
+    const char = token[index];
+
+    if (char === '[') bracketDepth += 1;
+    if (char === ']') bracketDepth -= 1;
+    if (char === ':' && bracketDepth === 0) lastSeparatorIndex = index;
+  }
+
+  return lastSeparatorIndex >= 0
+    ? token.slice(lastSeparatorIndex + 1)
+    : token;
+}
+
+function collectStaticStrings(node, result = []) {
+  if (!node) return result;
+
+  if (node.type === 'Literal' && typeof node.value === 'string') {
+    result.push(node.value);
+    return result;
+  }
+
+  if (node.type === 'TemplateLiteral') {
+    for (const quasi of node.quasis) {
+      if (quasi.value.cooked) result.push(quasi.value.cooked);
+    }
+
+    for (const expression of node.expressions) {
+      collectStaticStrings(expression, result);
+    }
+
+    return result;
+  }
+
+  for (const key of [
+    'left',
+    'right',
+    'argument',
+    'callee',
+    'test',
+    'consequent',
+    'alternate',
+    'object',
+    'property',
+  ]) {
+    collectStaticStrings(node[key], result);
+  }
+
+  for (const key of ['arguments', 'elements', 'expressions']) {
+    if (Array.isArray(node[key])) {
+      for (const child of node[key]) collectStaticStrings(child, result);
+    }
+  }
+
+  return result;
+}
+
+const tailwindEnforcementPlugin = {
+  rules: {
+    'no-arbitrary-font-size': {
+      create(context) {
+        function reportArbitraryFontSize(node, className) {
+          const violating = className
+            .split(/\s+/)
+            .map(token => token.trim())
+            .filter(Boolean)
+            .filter(token => ARBITRARY_FONT_SIZE_CLASS_PATTERN.test(splitTailwindClassToken(token)));
+
+          if (violating.length === 0) return;
+
+          context.report({
+            node,
+            message:
+              `字体规范：除非特殊情况，避免使用任意字体大小类 [${violating.join(', ')}]。` +
+              '请改用 Tailwind 标准字号，如 text-xs、text-sm、text-base、text-lg，避免小程序/H5 端单位转换不一致。',
+          });
+        }
+
+        function reportCssArbitraryFontSize(node, value) {
+          context.report({
+            node,
+            message:
+              `字体规范：除非特殊情况，避免在样式文件中直接声明 font-size: ${value}。` +
+              '请优先使用 Tailwind 标准字号类，如 text-xs、text-sm、text-base、text-lg，避免小程序/H5 端单位转换不一致。',
+          });
+        }
+
+        return {
+          JSXAttribute(node) {
+            if (node.name?.name !== 'className') return;
+
+            if (node.value?.type === 'Literal' && typeof node.value.value === 'string') {
+              reportArbitraryFontSize(node, node.value.value);
+              return;
+            }
+
+            if (node.value?.type !== 'JSXExpressionContainer') return;
+
+            for (const className of collectStaticStrings(node.value.expression)) {
+              reportArbitraryFontSize(node, className);
+            }
+          },
+          CallExpression(node) {
+            if (node.callee?.name !== '__cssArbitraryFontSize') return;
+
+            const [valueNode] = node.arguments;
+            const value = valueNode?.value;
+
+            reportCssArbitraryFontSize(
+              node,
+              typeof value === 'string' ? value : '任意字号'
+            );
+          },
+        };
+      },
+    },
+  },
+};
+
+const pageRestrictedCssImportPatterns = [
+  {
+    group: [
+      '*.css',
+      '**/*.css',
+      '*.scss',
+      '**/*.scss',
+      '*.less',
+      '**/*.less',
+      '*.sass',
+      '**/*.sass',
+    ],
+    message:
+      '样式规范：页面中禁止直接 import CSS/SCSS 文件，请使用 Tailwind className 实现样式。' +
+      '仅在 Tailwind 明显无法满足（如复杂关键帧动画）时才创建页面级样式文件，且范围须最小化。',
+  },
+];
+
+const TARO_NATIVE_SVG_ELEMENTS = [
+  'svg',
+  'circle',
+  'path',
+  'rect',
+  'line',
+  'polyline',
+  'polygon',
+  'ellipse',
+  'g',
+  'defs',
+  'clipPath',
+  'linearGradient',
+  'radialGradient',
+  'stop',
+  'mask',
+  'pattern',
+  'textPath',
+  'use',
+];
+
+const indexPageRestrictedSyntaxRules = [
+  {
+    selector: 'JSXText[value=/\\s*应用开发中\\s*/]',
+    message:
+      '工程规范：检测到首页 (src/pages/index/index.tsx) 仍为默认占位页面，这会导致用户无法进入新增页面，请根据用户需求开发实际的首页功能与界面。如果已经开发了新的首页，也需要删除旧首页，并更新 src/app.config.ts 文件',
+  },
+];
+
+export function createMicroappTaroEslintConfig(options = {}) {
+  const lucideColorCheckPlugin = createLucideColorCheckPlugin(options.lucideImportSources)
+  const pageRestrictedSyntaxRules = createPageRestrictedSyntaxRules(
+    options.preferredUiImportBase,
+  )
+  const defaults = tseslint.config(
+  {
+    ignores: ['eslint.config.mjs', 'dist/**', 'dist-*/**', 'node_modules/**', 'src/components/sar-game/**'],
+  },
+  eslint.configs.recommended,
+  ...tseslint.configs.recommended,
+  {
+    languageOptions: {
+      globals: {
+        ...globals.browser,
+        ...globals.node,
+        ...globals.es2021,
+      },
+      parserOptions: {
+        ecmaFeatures: { jsx: true },
+        sourceType: 'module',
+      },
+    },
+    settings: {
+      react: {
+        pragma: 'React',
+        version: 'detect',
+      },
+      'import/resolver': {
+        typescript: {
+          alwaysTryTypes: true,
+          project: './tsconfig.json',
+        },
+      },
+      'import/core-modules': ['@tarojs/taro', '@tarojs/components'],
+    },
+    plugins: {
+      react: fixupPluginRules(reactPlugin),
+      'react-hooks': fixupPluginRules(reactHooksPlugin),
+      import: fixupPluginRules(importPlugin),
+    },
+    rules: {
+      'react-hooks/rules-of-hooks': 'error',
+      'react-hooks/exhaustive-deps': 'warn',
+      'react/jsx-key': 'warn',
+      'react/jsx-no-duplicate-props': ['error', { ignoreCase: true }],
+      'react/jsx-no-undef': 'error',
+      'react/jsx-uses-vars': 'error',
+      'react/jsx-uses-react': 'off',
+      'react/react-in-jsx-scope': 'off',
+      'react/no-children-prop': 'error',
+      'react/no-direct-mutation-state': 'error',
+      'react/no-string-refs': 'error',
+      'react/require-render-return': 'error',
+      'react/no-danger-with-children': 'error',
+      'react/jsx-no-leaked-render': ['error', { validStrategies: ['ternary', 'coerce'] }],
+
+      'import/export': 'error',
+      'import/no-duplicates': 'error',
+
+      'no-undef': 'off',
+      '@typescript-eslint/no-explicit-any': 'off',
+      '@typescript-eslint/no-unused-vars': 'off',
+      '@typescript-eslint/no-require-imports': 'off',
+      '@typescript-eslint/no-namespace': 'off',
+
+      'react/forbid-elements': [
+        'error',
+        {
+          forbid: [
+            { element: 'select', message: '请使用 Picker 组件代替 <select>' },
+            ...TARO_NATIVE_SVG_ELEMENTS.map(element => ({
+              element,
+              message:
+                `抖音小程序兼容性：禁止使用原生 <${element}> SVG 标签。` +
+                '请优先用 View + Tailwind/CSS 实现；其次使用 Image、本地静态资源或项目已适配的 @open-dy/lucide-taro 图标组件；复杂动态绘制才考虑 Canvas。',
+            })),
+          ],
+        },
+      ],
+      'tailwindcss/classnames-order': 'off',
+      'tailwindcss/no-custom-classname': 'off',
+    },
+  },
+  {
+    files: ['src/**/*.{js,jsx,ts,tsx}'],
+    ignores: ['src/network.ts'],
+    plugins: {
+      lucide: lucideColorCheckPlugin,
+      microappPages,
+      tailwind: tailwindEnforcementPlugin,
+    },
+    rules: {
+      'microappPages/nav-url-in-app-pages': 'error',
+      // 'microappPages/page-dirs-in-app-pages': 'error',
+      'microappPages/declared-pages-must-exist': 'error',
+      'microappPages/no-screen-height-in-tabbar-page': 'error',
+      'lucide/require-lucide-color': 'error',
+      'tailwind/no-arbitrary-font-size': 'error',
+      '@typescript-eslint/no-require-imports': 'error',
+      'no-restricted-syntax': ['error', ...baseRestrictedSyntaxRules],
+      'no-restricted-globals': [
+        'error',
+        {
+          name: 'fetch',
+          message:
+            '工程规范：禁止直接使用 fetch API，请使用 network.ts 中的 Network.request 方法来发起网络请求。',
+        },
+      ],
+      'no-restricted-properties': [
+        'error',
+        {
+          object: 'window',
+          property: 'fetch',
+          message:
+            '工程规范：禁止直接使用 window.fetch API，请使用 network.ts 中的 Network.request 方法来发起网络请求。',
+        },
+        {
+          object: 'Taro',
+          property: 'request',
+          message:
+            "工程规范：请使用 Network.request 替代 Taro.request，导入方式: import { Network } from '@/network'",
+        },
+        {
+          object: 'Taro',
+          property: 'uploadFile',
+          message:
+            "工程规范：请使用 Network.uploadFile 替代 Taro.uploadFile，导入方式: import { Network } from '@/network'",
+        },
+        {
+          object: 'Taro',
+          property: 'downloadFile',
+          message:
+            "工程规范：请使用 Network.downloadFile 替代 Taro.downloadFile，导入方式: import { Network } from '@/network'",
+        },
+        {
+          object: 'Taro',
+          property: 'getWindowInfo',
+          message:
+            "工程规范：请使用 Taro.getSystemInfoSync 替代 Taro.getWindowInfo",
+        },
+      ],
+    },
+  },
+  {
+    files: ['src/**/*.{css,scss}'],
+    plugins: {
+      local: cssImportGuardPlugin,
+      tailwind: tailwindEnforcementPlugin,
+    },
+    processor: 'local/css',
+    rules: {
+      'no-undef': 'off',
+      'tailwind/no-arbitrary-font-size': 'error',
+      'no-restricted-syntax': ['error', ...baseRestrictedSyntaxRules],
+    },
+  },
+  {
+    files: ['src/components/ui/**/*.tsx'],
+    rules: {
+      'lucide/require-lucide-color': 'off',
+    },
+  },
+  {
+    files: ['src/pages/**/*.tsx'],
+    rules: {
+      'no-restricted-syntax': [
+        'error',
+        ...baseRestrictedSyntaxRules,
+        ...pageRestrictedSyntaxRules,
+      ],
+      'no-restricted-imports': ['warn', { patterns: pageRestrictedCssImportPatterns }],
+    },
+  },
+  {
+    files: ['src/pages/index/index.tsx'],
+    rules: {
+      'no-restricted-syntax': [
+        'error',
+        ...baseRestrictedSyntaxRules,
+        ...pageRestrictedSyntaxRules,
+        ...indexPageRestrictedSyntaxRules,
+      ],
+      'no-restricted-imports': ['warn', { patterns: pageRestrictedCssImportPatterns }],
+    },
+  },
+);
+
+const overrides = options.overrides
+if (!overrides) return defaults
+if (typeof overrides === 'function') return overrides(defaults) ?? defaults
+return tseslint.config(...defaults, ...(Array.isArray(overrides) ? overrides : [overrides]))
+}
+
+export default createMicroappTaroEslintConfig

package/src/index.ts

@@ -0,0 +1,2 @@
+export * from './runtime/index'
+export * from './build/index'

package/src/internal/runtime/douyin-open-button.d.ts

@@ -0,0 +1,29 @@
+/**
+ * 抖音 Button openType 扩展。上游 Taro 类型未声明这些字段，但 TT 运行时支持。
+ * 保持为 module，确保 declare module 与官方 Button 类型合并而不是覆盖。
+ */
+import "@tarojs/components";
+
+export {};
+
+declare global {
+  type DouyinOpenTypeDetailEvent = {
+    detail?: { errMsg?: string; errNo?: number };
+  };
+
+  type DouyinOpenButtonExtras = {
+    hideBorder?: boolean;
+    dataVideoId?: string;
+    dataVideoType?: string;
+    dataChannel?: string;
+    "data-video-id"?: string;
+    "data-video-type"?: string;
+    "data-channel"?: string;
+    onNavigateToVideoView?: (event: DouyinOpenTypeDetailEvent) => void;
+    onAddShortcut?: (event: DouyinOpenTypeDetailEvent) => void;
+  };
+}
+
+declare module "@tarojs/components/types/Button" {
+  interface ButtonProps extends DouyinOpenButtonExtras {}
+}