fix(loader): 缓存Page 和 App 源码的同时也对 sourcemap 进行缓存,并将其传递下去,避免 sourcemap… #18506
Conversation
Walkthrough多个加载器的默认导出函数签名增加可选 Changes
Sequence Diagram(s)sequenceDiagram
participant Loader as Loader (任一加载器)
participant EntryCache as entryCache
participant Webpack as webpack (this.async callback)
Loader->>EntryCache: 查询 key (page/app/...)
alt 缓存命中
EntryCache-->>Loader: 返回 { source, map }
Loader->>Webpack: 调用 callback(content.source, content.map)
Note right of EntryCache#0000ff: 使用 setImmediate 延后删除键
else 未命中
Loader->>EntryCache: 写入 { source, map }
Loader->>Webpack: 返回常规处理结果（同步或异步）
end
代码审核工作量评估🎯 3 (中等) | ⏱️ ~20 分钟 变更跨 7 个文件且模式一致（签名扩展与缓存对象化），但 诗
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
📜 Recent review detailsConfiguration used: CodeRabbit UI Review profile: CHILL Plan: Pro 📒 Files selected for processing (7)
🚧 Files skipped from review as they are similar to previous changes (4)
🧰 Additional context used🧬 Code graph analysis (2)packages/taro-loader/src/app.ts (1)
packages/taro-loader/src/component.ts (2)
🔇 Additional comments (2)
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 |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🧹 Nitpick comments (7)
packages/taro-loader/src/entry-cache.ts (1)
1-1: 为 entryCache 建立强类型，提升可读性与可靠性当前使用
Map<string, any>。建议定义明确的数据结构，避免误用并获得更好的提示。+interface EntryCacheValue { + source: string | Buffer + map?: any +} -export const entryCache = new Map<string, any>() +export const entryCache = new Map<string, EntryCacheValue>()packages/taro-loader/src/app.ts (2)
9-9: 签名扩展合理，便于 sourcemap 透传变更与 PR 目标一致。建议将
map明确为更窄类型以便提示（如 RawSourceMap）。示例：
// import type { RawSourceMap } from 'source-map' export default function (this: webpack.LoaderContext<any>, source: string, map?: any /* RawSourceMap */) { ... }
19-22: 缓存 key 建议去歧义，避免并行/多编译器碰撞当前使用固定 key
'app'。在多 compiler、并行或 watch 场景下可能短暂重入覆盖。建议把this.resourcePath或this._compilation?.hash纳入 key，并同步更新entryCacheLoader的查询参数。示例：
-const entryCacheLoader = path.join(__dirname, 'entry-cache.js') + '?name=app' -entryCache.set('app', { +const cacheKey = `app:${this._compilation?.hash || this.resourcePath}` +const entryCacheLoader = path.join(__dirname, 'entry-cache.js') + `?name=${cacheKey}` +entryCache.set(cacheKey, { source, map })请确认是否存在多 compiler 并行场景，以评估必要性。
packages/taro-loader/src/native-component.ts (1)
9-9: 签名扩展正确；可考虑收紧 map 类型与其它 loader 保持一致，便于 sourcemap 透传。可选将
map注明为更精确类型以获得更好提示。packages/taro-loader/src/page.ts (2)
15-15: 签名扩展合理，保持与其它 loader 一致便于 sourcemap 透传。可选：将
map收紧为更精确类型以改进类型提示。
26-29: 缓存写入正确；建议校验 pageName 并考虑 key 去歧义
- 使用
{ source, map }符合新的entry-cache读取逻辑。- 建议在进入前断言
pageName非空，或为entry-cache提供兜底（已在另一评论建议补齐）。- 若存在多 compiler/并行构建，同名页面（理论上不应重名）仍可能碰撞，必要时可将
resourcePath拼入 key。示例（可选）：
const cacheKey = `${pageName}:${this.resourcePath}` entryCache.set(cacheKey, { source, map }) // 同步更新 entryCacheLoader 的 name 查询参数packages/taro-loader/src/component.ts (1)
8-8: 签名扩展 OK；建议（可选）使用更精确的 sourcemap 类型便于 IDE 提示与后续维护。
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (7)
packages/taro-loader/src/app.ts(2 hunks)packages/taro-loader/src/component.ts(1 hunks)packages/taro-loader/src/entry-cache.ts(1 hunks)packages/taro-loader/src/independentPage.ts(2 hunks)packages/taro-loader/src/native-component.ts(2 hunks)packages/taro-loader/src/native-page.ts(2 hunks)packages/taro-loader/src/page.ts(2 hunks)
🧰 Additional context used
🧬 Code graph analysis (6)
packages/taro-loader/src/native-page.ts (1)
packages/taro-loader/src/entry-cache.ts (1)
entryCache(1-1)
packages/taro-loader/src/independentPage.ts (1)
packages/taro-loader/src/entry-cache.ts (1)
entryCache(1-1)
packages/taro-loader/src/app.ts (1)
packages/taro-loader/src/entry-cache.ts (1)
entryCache(1-1)
packages/taro-loader/src/page.ts (1)
packages/taro-loader/src/entry-cache.ts (1)
entryCache(1-1)
packages/taro-loader/src/component.ts (2)
packages/taro-loader/src/util.ts (1)
stringifyRequest(21-23)packages/taro-loader/src/entry-cache.ts (1)
entryCache(1-1)
packages/taro-loader/src/native-component.ts (1)
packages/taro-loader/src/entry-cache.ts (1)
entryCache(1-1)
🔇 Additional comments (6)
packages/taro-loader/src/native-component.ts (1)
21-24: 缓存写入 LGTM；请确保 pageName 恒定存在将
{ source, map }写入缓存与entry-cache的读取契合。为稳妥起见，请确认options.name（即pageName）在所有调用路径下均为非空；若存在为空的可能，结合entry-cache的兜底分支处理，避免构建异常。packages/taro-loader/src/component.ts (1)
16-19: 缓存写入 LGTM；与 entry-cache 配合正确
{ source, map }进入缓存，entry-cache 会以(null, source, map)回传，能修复 sourcemap 链断裂问题。无阻碍发布。packages/taro-loader/src/independentPage.ts (2)
14-14: 函数签名更新正确。正确添加了
map参数以接收来自 babel-loader 的 sourcemap。这符合 webpack loader API 的约定。
34-37: 缓存对象格式已正确应用于所有生产者和消费者。验证结果：
entryCache在 6 个文件中进行set操作（independentPage.ts、page.ts、native-page.ts、native-component.ts、component.ts、app.ts），所有调用都使用了一致的对象格式{ source, map }。唯一的消费者 entry-cache.ts 中的第 10 行代码正确地解构访问了这两个属性：callback(null, content!.source, content!.map)。缓存流程完整且一致，不存在格式不匹配的问题。packages/taro-loader/src/native-page.ts (2)
9-9: 函数签名更新正确。与
independentPage.ts保持一致,正确添加了map参数以接收 sourcemap。
20-23: Sourcemap 缓存逻辑正确。与
independentPage.ts保持一致的实现模式,将source和map作为对象存储,确保 sourcemap 链路完整。实现符合 PR 目标。
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## main #18506 +/- ##
=======================================
Coverage 55.97% 55.97%
=======================================
Files 416 416
Lines 21560 21560
Branches 5300 5304 +4
=======================================
Hits 12069 12069
- Misses 8014 8036 +22
+ Partials 1477 1455 -22
Flags with carried forward coverage won't be shown. Click here to find out more. 🚀 New features to boost your workflow:
|
Single-Dancer
force-pushed
the
fix/sourcemap-not-match-to-original
branch
from
83479b6 to
b7e5b78
Compare
2 participants
… 链断裂
这个 PR 做了什么？ (简要描述所做更改)
修复 #16034 ，确保Page 和 App 通过 babel-loader 生成的 sourceMap 能够正确传递下去
这个 PR 是什么类型？ (至少选择一个)
这个 PR 涉及以下平台：
Summary by CodeRabbit
发布说明