-
Notifications
You must be signed in to change notification settings - Fork 614
chore: update vue-renderer-markdown & vue-use-monaco deps to perf use Monaco use raf render #896
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
…Monaco use raf render
WalkthroughBumped two devDependencies in package.json: vue-renderer-markdown from ^0.0.44 to ^0.0.47 and vue-use-monaco from ^0.0.15 to ^0.0.17. No other files or public API signatures changed. Changes
Estimated code review effort🎯 1 (Trivial) | ⏱️ ~2 minutes Possibly related PRs
Pre-merge checks (2 passed, 1 warning)❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
Poem
Tip 👮 Agentic pre-merge checks are now available in preview!Pro plan users can now enable pre-merge checks in their settings to enforce checklists before merging PRs.
Please see the documentation for more information. Example: reviews:
pre_merge_checks:
custom_checks:
- name: "Undocumented Breaking Changes"
mode: "warning"
instructions: |
Pass/fail criteria: All breaking changes to public APIs, CLI flags, environment variables, configuration keys, database schemas, or HTTP/GraphQL endpoints must be documented in the "Breaking Change" section of the PR description and in CHANGELOG.md. Exclude purely internal or private changes (e.g., code not exported from package entry points or explicitly marked as internal).Please share your feedback with us on this Discord post. ✨ Finishing touches🧪 Generate unit tests
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.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 3
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (1)
package.json(1 hunks)
🧰 Additional context used
🧠 Learnings (4)
📚 Learning: 2025-07-23T00:45:57.322Z
Learnt from: CR
PR: ThinkInAIXYZ/deepchat#0
File: .cursor/rules/vue-shadcn.mdc:0-0
Timestamp: 2025-07-23T00:45:57.322Z
Learning: Applies to src/renderer/**/*.{vue} : Use Shadcn Vue, Radix Vue, and Tailwind for components and styling.
Applied to files:
package.json
📚 Learning: 2025-07-21T01:46:30.354Z
Learnt from: CR
PR: ThinkInAIXYZ/deepchat#0
File: .cursor/rules/i18n.mdc:0-0
Timestamp: 2025-07-21T01:46:30.354Z
Learning: Applies to src/renderer/src/**/* : Use the 'vue-i18n' framework for all internationalization in the renderer
Applied to files:
package.json
📚 Learning: 2025-07-23T00:45:57.322Z
Learnt from: CR
PR: ThinkInAIXYZ/deepchat#0
File: .cursor/rules/vue-shadcn.mdc:0-0
Timestamp: 2025-07-23T00:45:57.322Z
Learning: Applies to src/renderer/{composables,utils}/**/*.ts : Use VueUse for common composables and utility functions.
Applied to files:
package.json
📚 Learning: 2025-07-23T00:45:57.322Z
Learnt from: CR
PR: ThinkInAIXYZ/deepchat#0
File: .cursor/rules/vue-shadcn.mdc:0-0
Timestamp: 2025-07-23T00:45:57.322Z
Learning: Applies to src/renderer/**/*.{vue} : Use Vue 3 with TypeScript, leveraging defineComponent and PropType.
Applied to files:
package.json
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: build-check (x64)
🔇 Additional comments (2)
package.json (2)
163-163: Check Monaco peer/dup bundling with Vite plugin — manual verification requiredAutomated checks in the sandbox produced no output; confirm locally that Monaco isn’t being double-bundled.
package.json (line ~163) shows: "vue-use-monaco": "^0.0.17". Do the following and paste outputs/snippets here:
- vite.config.{js,ts,mjs} — paste the plugin section(s) that reference monaco or vite-plugin-monaco-editor-esm (or state if none).
- package.json — paste dependencies/devDependencies entries for monaco-editor, vue-use-monaco, vite-plugin-monaco-editor-esm.
- Run and paste: pnpm why monaco-editor && pnpm why vue-use-monaco (or npm ls monaco-editor && npm ls vue-use-monaco if using npm/yarn).
If two monaco-editor copies appear, externalize monaco in the Vite plugin or align/lock versions so only one monaco-editor is bundled.
163-163: Confirm editor integration remains stable.npm shows vue-use-monaco@0.0.17 is published and lists monaco-editor as a dependency; I found no migration/release notes from 0.0.15. (npmjs.com)
- Verify your monaco-editor@^0.52.2 is resolved to a single instance (check whether vue-use-monaco declares monaco-editor as a dependency vs a peerDependency).
- Smoke-test in-app: theme switching, worker startup (Vite/webpack Monaco worker config), and onDidChangeModelContent behavior (throttling / requestAnimationFrame).
| "vue": "^3.5.21", | ||
| "vue-i18n": "^11.1.11", | ||
| "vue-renderer-markdown": "^0.0.44", | ||
| "vue-renderer-markdown": "^0.0.47", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
💡 Verification agent
🧩 Analysis chain
Lockfile & CI check.
Ensure pnpm-lock.yaml is updated and CI runs typecheck/build to catch any subtle breakages in the renderer.
Also applies to: 163-163
🏁 Script executed:
#!/bin/bash
# Verify lockfile changed and basic sanity
git status -s | rg -n 'pnpm-lock.yaml' || echo "pnpm-lock.yaml not updated"
pnpm run typecheck:web && pnpm run build:unpackLength of output: 277
Commit pnpm-lock.yaml and ensure CI runs typecheck/build
pnpm-lock.yaml wasn't updated (git status) and local pnpm run typecheck:web failed: vue-tsc not found (node_modules missing).
- Run
pnpm installand commit the updated pnpm-lock.yaml (package.json edits around lines ~160/163). - Ensure CI installs deps (e.g.
pnpm install --frozen-lockfile) and runspnpm run typecheck:webandpnpm run build:unpack. - Verify
vue-tscis present in devDependencies so the typecheck step succeeds.
🤖 Prompt for AI Agents
In package.json around line 160, the repo changes added/modified dependencies
but pnpm-lock.yaml was not updated and CI/typecheck fails because node_modules
(and vue-tsc) are missing; run `pnpm install` locally, commit the updated
pnpm-lock.yaml, add `vue-tsc` to devDependencies if it’s missing so `pnpm run
typecheck:web` can find it, and update CI workflow to run dependency install
with `pnpm install --frozen-lockfile` followed by `pnpm run typecheck:web` and
`pnpm run build:unpack`.
💡 Verification agent
🧩 Analysis chain
These look like runtime renderer deps; consider moving them out of devDependencies.
If vue-renderer-markdown and vue-use-monaco are imported by the app at runtime (likely in src/renderer), keeping them in devDependencies risks missing-module errors in production builds where dev deps are pruned by electron-builder. Move them to dependencies or confirm your packager includes dev deps.
Apply this minimal diff:
@@ "dependencies": {
- "zod": "^3.25.76"
+ "zod": "^3.25.76",
+ "vue-renderer-markdown": "^0.0.47",
+ "vue-use-monaco": "^0.0.17"
@@ "devDependencies": {
- "vue-renderer-markdown": "^0.0.47",
@@
- "vue-use-monaco": "^0.0.17",Run to verify imports are runtime:
Also applies to: 163-163
🏁 Script executed:
#!/bin/bash
# Expect matches under src/renderer if used at runtime.
rg -n --type=ts --type=vue -C1 -g 'src/renderer/**' -e '\bvue-renderer-markdown\b|\bvue-use-monaco\b'Length of output: 27
🏁 Script executed:
#!/bin/bash
set -euo pipefail
echo "Searching src/renderer for package usage..."
rg -n -C2 -g 'src/renderer/**' -e 'vue-renderer-markdown|vue-use-monaco' --hidden || true
echo "Searching src/ for import/require/dynamic import patterns..."
rg -n -C2 -g 'src/**' -e "from ['\"](vue-renderer-markdown|vue-use-monaco)['\"]" -e "require\(['\"](vue-renderer-markdown|vue-use-monaco)['\"]\)" -e "import\(['\"](vue-renderer-markdown|vue-use-monaco)['\"]\)" --hidden || true
echo "Searching package.json and lockfiles for declarations..."
rg -n -S -e 'vue-renderer-markdown|vue-use-monaco' package.json package-lock.json yarn.lock pnpm-lock.yaml pnpm-lock.json 2>/dev/null || true
echo "If no matches are found above, run a broader repo search:"
rg -n -C2 -e 'vue-renderer-markdown|vue-use-monaco' || true
echo "Done."Length of output: 11585
Move vue-renderer-markdown and vue-use-monaco to dependencies
These packages are imported by runtime code under src/renderer (src/renderer/src/main.ts, src/renderer/src/components/markdown/MarkdownRenderer.vue, src/renderer/src/components/artifacts/CodeArtifact.vue, src/renderer/src/components/artifacts/ArtifactDialog.vue, src/renderer/src/components/ui/UpdateDialog.vue, src/renderer/src/components/message/MessageBlockThink.vue, src/renderer/src/components/settings/AboutUsSettings.vue). Keep them in dependencies to avoid missing-module errors in production builds (electron-builder may prune devDependencies).
@@ "dependencies": {
- "zod": "^3.25.76"
+ "zod": "^3.25.76",
+ "vue-renderer-markdown": "^0.0.47",
+ "vue-use-monaco": "^0.0.17"
@@ "devDependencies": {
- "vue-renderer-markdown": "^0.0.47",
@@
- "vue-use-monaco": "^0.0.17",📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| "vue-renderer-markdown": "^0.0.47", | |
| "dependencies": { | |
| "zod": "^3.25.76", | |
| "vue-renderer-markdown": "^0.0.47", | |
| "vue-use-monaco": "^0.0.17" | |
| }, | |
| "devDependencies": { | |
| /* other devDependencies remain; vue-renderer-markdown and vue-use-monaco removed */ | |
| } |
🤖 Prompt for AI Agents
In package.json around line 160, vue-renderer-markdown (and vue-use-monaco) are
currently in devDependencies but are imported by runtime code under src/renderer
and can be pruned by electron-builder; move both packages from devDependencies
into dependencies (update package.json to remove them from devDependencies and
add them with the same version strings under dependencies) so production builds
include them and runtime imports do not fail.
💡 Verification agent
🧩 Analysis chain
Review upstream changelogs for breaking changes (rendering/DOMPurify/syntax).
Given the “perf use raf render” note, confirm any API/option changes in vue-renderer-markdown@0.0.45–0.0.47 don’t affect your markdown pipeline (plugins, sanitizer, code block rendering).
🌐 Web query:
Changelog or release notes for vue-renderer-markdown versions 0.0.45–0.0.47; note breaking changes or required config updates.
💡 Result:
Summary for vue-renderer-markdown 0.0.45 → 0.0.47
- Primary source: package README / release info on npm and GitHub. [1][2].
What changed (high‑level)
- 0.0.45→0.0.47 are patch/minor releases focused on streaming/UX and peer‑dependency updates; the README/notes emphasize:
- Prop name change: component now expects content (or nodes) instead of the older value/source prop in templates — use :content (JS/TS prop remains camelCase). This requires updating templates that used :value or :source. [1]
- Peer dependency installs are now required (vue, katex, mermaid, monaco-related packages, etc.). Install the listed peers or you will see warnings / runtime failures. [1][2]
- Monaco editor integration: additional build/vite configuration may be required if you use the Monaco integration (see vite-plugin-monaco-editor-esm/customDistPath notes). If you do not use Monaco, this peer is optional. [1]
- Emphasis in README that the package is streaming‑first and optimized for incremental parsing; several internal parser/DOM-update improvements were made (no user config required, but behaviour with live/partial markdown may differ). [1][2]
Breaking changes / required config updates
- Update templates/usage:
- Replace older prop names (value/source) with :content (or pass parsed nodes via :nodes). Check where you used kebab-case in templates (use :typewriter-effect for typewriterEffect, etc.). This is necessary for 0.0.45+ usage. [1]
- Install required peer dependencies listed in package.json (vue, @iconify/vue, @vueuse/core, katex, mermaid, vue-use-monaco, etc.) if your project uses the corresponding features; otherwise install only the ones you need. Failing to install required peers will trigger warnings and can break runtime features. [1]
- If you use Monaco editor features, add/adjust vite-plugin-monaco-editor-esm configuration (languageWorkers/customDistPath) as shown in the README. [1]
Where to see full, line‑by‑line release notes / changelog
- npm package page (README and publish notes): https://www.npmjs.com/package/vue-renderer-markdown. [1]
- GitHub repository (README / releases / tags / CHANGELOG in repo): https://github.com/Simon-He95/vue-markdown-render. [2]
If you want, I can fetch the exact changelog entries for 0.0.45, 0.0.46 and 0.0.47 and paste the verbatim release notes. Which would you prefer?
Sources:
[1] vue-renderer-markdown — npm package page. (npmjs.com)
[2] vue-markdown-render — GitHub repository (README / repo). (github.com)
Citations:
- 1: https://www.npmjs.com/package/vue-renderer-markdown
- 2: https://github.com/Simon-He95/vue-markdown-render
Action required: address breaking changes from vue-renderer-markdown 0.0.45–0.0.47
- Update templates: replace any :value / :source usage with :content (or pass parsed nodes via :nodes); audit prop kebab/camel-case mappings for this component.
- Install any required peer dependencies used by your project (examples: vue, @iconify/vue, @vueuse/core, katex, mermaid, monaco-related packages) to avoid warnings/runtime failures.
- If you use Monaco integration, update Vite/monaco plugin config per upstream README (customDistPath / languageWorkers).
- Test rendering behavior (streaming/incremental parsing) end-to-end — verify DOMPurify/syntax highlighting/code-block rendering still behave with live/partial markdown.
File: package.json (around line 160: "vue-renderer-markdown": "^0.0.47")
🤖 Prompt for AI Agents
File: package.json (around line 160). The dependency upgrade to
vue-renderer-markdown ^0.0.47 introduces breaking changes: update any
templates/components that pass :value or :source to instead pass :content (or
use :nodes to pass parsed nodes), audit and fix any prop name mismatches between
kebab-case and camelCase for this component, install required peer dependencies
used in your app (e.g., vue, @iconify/vue, @vueuse/core, katex, mermaid, and any
monaco-related packages) to avoid runtime warnings, if you use Monaco update
your Vite/monaco plugin config per the upstream README (adjust customDistPath
and languageWorkers settings), and run full end-to-end rendering tests to verify
streaming/incremental parsing, DOMPurify, syntax highlighting and code-block
rendering still behave correctly.
Pull Request Description
Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is.
*For example: I'm always frustrated when [...] *
Describe the solution you'd like
A clear and concise description of what you want to happen.
UI/UX changes for Desktop Application
If this PR introduces UI/UX changes, please describe them in detail.
Platform Compatibility Notes
If this PR has specific platform compatibility considerations (Windows, macOS, Linux), please describe them here.
Additional context
Add any other context about the pull request here.
Pull Request Description (中文)
你的功能请求是否与某个问题有关?请描述一下。
请对问题进行清晰扼要的描述。
*例如:我增加了 [...] 的功能 *
请描述你希望的解决方案
请对你希望实现的效果进行清晰扼要的描述。
桌面应用程序的 UI/UX 更改
如果此 PR 引入了 UI/UX 更改,请详细描述它们。
平台兼容性注意事项
如果此 PR 具有特定的平台兼容性考虑因素(Windows、macOS、Linux),请在此处描述。
附加背景
在此处添加关于此 Pull Request 的任何其他背景信息。
Summary by CodeRabbit
Chores
User Impact
Reliability