fix(@vben/common-ui): 修复 JsonViewer 在 Vite 下因 CJS 默认导出未解包导致的渲染失败

[dullathanol]

Description

vue-json-viewer 为 UMD/CJS 包，在 Vite ESM 下可能得到 { default: Component }。升级 Vite 8 后依赖预构建与 CJS interop 变化，未解包会导致 Component is missing template or render。对默认导入取 .default ?? 原导入以兼容两种形态。

Type of change

Please delete options that are not relevant.

• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to not work as expected)
• This change requires a documentation update
• Please, don't make changes to pnpm-lock.yaml unless you introduce a new test example.

Checklist

ℹ️ Check all checkboxes - this will indicate that you have done everything in accordance with the rules in CONTRIBUTING.

• If you introduce new functionality, document it. You can run documentation with pnpm run docs:dev command.
• Run the tests with pnpm test.
• Changes in changelog are generated from PR name. Please, make sure that it explains your changes in an understandable manner. Please, prefix changeset messages with feat:, fix:, perf:, docs:, or chore:.
• My code follows the style guidelines of this project
• I have performed a self-review of my own code
• I have commented my code, particularly in hard-to-understand areas
• I have made corresponding changes to the documentation
• My changes generate no new warnings
• I have added tests that prove my fix is effective or that my feature works
• New and existing unit tests pass locally with my changes
• Any dependent changes have been merged and published in downstream modules

Summary by CodeRabbit

• Bug Fixes

  • Improved JSON viewer component compatibility in Vite environments.

• Refactor

  • Refactored form field help content rendering system.

• Chores

  • Cleaned up workspace configuration files.

[changeset-bot]

⚠️ No Changeset found

Latest commit: 30f968a

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 75d03e78-6c00-4ec6-a4cf-07f671c7629d

📥 Commits

Reviewing files that changed from the base of the PR and between 4c1e3b9 and 30f968a.

📒 Files selected for processing (4)

• packages/@core/ui-kit/form-ui/src/form-render/form-field.vue
• packages/effects/common-ui/src/components/json-viewer/index.vue
• playground/src/views/examples/form/basic.vue
• pnpm-workspace.yaml

💤 Files with no reviewable changes (1)

• pnpm-workspace.yaml

---

📝 Walkthrough

Walkthrough

This PR refines form help rendering by deferring API resolution to runtime, updates JSON viewer component export handling for CJS/UMD compatibility, reformats a form example helper callback, and removes a trailing workspace configuration entry.

Changes

Cohort / File(s)	Summary
Form Help Rendering packages/@core/ui-kit/form-ui/src/form-render/form-field.vue, playground/src/views/examples/form/basic.vue	Refactored computedHelp to wrap helpContent in a function calling getFormApi() at runtime instead of using cached formApi. Reformatted example callback to multi-line arrow function syntax.
JSON Viewer Export Handling packages/effects/common-ui/src/components/json-viewer/index.vue	Added safe unwrapping of default exports for CJS/UMD modules via VueJsonViewer constant, addressing Vite module parsing compatibility.
Workspace Configuration pnpm-workspace.yaml	Removed trailing empty line entry from catalog block.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Possibly related PRs

• PR #5572: Modifies help handling in form-field.vue to support CustomRenderType and rendering patterns
• PR #7675: Implements identical CJS/UMD default export unwrapping pattern for module compatibility
• PR #4806: Exposes and adds getFormApi() function for runtime form API access in help rendering

Suggested labels

bug

Suggested reviewers

• anncwb
• vince292007
• mynetfan

Poem

🐰 A form's help now whispers late,
No cached promises to gate,
JSON viewers stand unwrapped and true,
Runtime calls—the fresh morning dew! ✨

🚥 Pre-merge checks | ✅ 2 | ❌ 1

❌ Failed checks (1 inconclusive)

Check name	Status	Explanation	Resolution
Description check	❓ Inconclusive	The description provides technical context about the vue-json-viewer UMD/CJS compatibility issue and Vite 8 changes, but the required Type of change and Checklist sections remain unchecked.	Mark the appropriate checkbox under 'Type of change' (likely 'Bug fix') and complete the checklist items to confirm compliance with project contribution guidelines.

✅ Passed checks (2 passed)

Check name	Status	Explanation
Title check	✅ Passed	The PR title specifically addresses the JsonViewer rendering issue caused by unresolved CJS default exports in Vite, directly matching the main change in the codebase.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with 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.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}