feat(vite-runner): add custom-tab-bar compilation support#19276
Conversation
WalkthroughThis PR implements complete custom tabbar compilation support for Taro Vite mini apps. It adds a dedicated Vite plugin that intercepts custom tabbar entry scripts, recursively processes component dependencies, generates configuration assets, and produces final module code with component instantiation—while also integrating this pipeline into the app entry and compiler initialization flow. ChangesCustom Tabbar Compilation Pipeline
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Warning There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure. 🔧 ESLint
ESLint install failed: dependency version conflict. Check your lock file or package.json. Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
packages/taro-vite-runner/src/mini/entry.ts (1)
80-106: 💤 Low value代码重复:
isAlipay和tabBarDir逻辑在tabbar.ts中也存在。
entry.ts和tabbar.ts中都有相同的isAlipay判断和tabBarDir计算逻辑(第 83-84 行 vstabbar.ts第 115-116 行)。考虑将此逻辑提取为共享工具函数以保持一致性。不过这是一个较小的 DRY 违规,由于逻辑简单且两个插件独立运行,当前实现也可以接受。
♻️ 可选的重构建议
可在
utils中新增共享函数:// utils/tabbar.ts export function getTabBarDirName(): string { const isAlipay = process.env.TARO_ENV === 'alipay' return isAlipay ? 'customize-tab-bar' : 'custom-tab-bar' }然后在
entry.ts和tabbar.ts中复用。🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@packages/taro-vite-runner/src/mini/entry.ts` around lines 80 - 106, The duplicate logic computing isAlipay and tabBarDir in entry.ts (variables isAlipay, tabBarDir) and tabbar.ts should be extracted into a shared utility; create a function like getTabBarDirName() that reads process.env.TARO_ENV and returns the correct directory string, replace the inline logic in both entry.ts (where scriptPath/tabBarDir are used and emitFile is called) and tabbar.ts to call getTabBarDirName(), and import that util from a new utils/tabbar.ts so both modules share the same implementation.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Nitpick comments:
In `@packages/taro-vite-runner/src/mini/entry.ts`:
- Around line 80-106: The duplicate logic computing isAlipay and tabBarDir in
entry.ts (variables isAlipay, tabBarDir) and tabbar.ts should be extracted into
a shared utility; create a function like getTabBarDirName() that reads
process.env.TARO_ENV and returns the correct directory string, replace the
inline logic in both entry.ts (where scriptPath/tabBarDir are used and emitFile
is called) and tabbar.ts to call getTabBarDirName(), and import that util from a
new utils/tabbar.ts so both modules share the same implementation.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 0a426099-a146-4ddc-b08d-1f446dc60dca
📒 Files selected for processing (3)
packages/taro-vite-runner/src/mini/entry.tspackages/taro-vite-runner/src/mini/index.tspackages/taro-vite-runner/src/mini/tabbar.ts
这个 PR 做了什么? (简要描述所做更改)
原因:vite-runner 缺少 custom-tab-bar 编译逻辑,导致使用
tabBar.custom: true时 dist 下无 custom-tab-bar 目录。webpack5-runner 已支持。修复方式:新增
tabbar.ts插件,对齐 webpack5-runner 行为。这个 PR 是什么类型? (至少选择一个)
这个 PR 涉及以下平台:
Summary by CodeRabbit
发布说明
新特性
改进