feat: add plugin-preview #482
Conversation
Pull Request Test Coverage Report for Build 15387494683Details
💛 - Coveralls |
|
Plz review this and improve it's style. |
|
The content has not been rendered correctly.
|
|
Nice style, I still have some todos in my sight:
|
Mister-Hope
requested review from
Copilot and
pengzhanbo
and removed request for
pengzhanbo
There was a problem hiding this comment.
Pull Request Overview
Adds a new VuePress plugin for previewing Markdown content (@vuepress/plugin-markdown-preview), including rendering logic, styles, client integration, and documentation updates.
- Introduce
plugin-markdown-previewunderplugins/markdown, with node and client code - Add SCSS/CSS variables, Vue components, and Markdown-It demo integration
- Update docs, sidebar, and site config to include the new plugin
Reviewed Changes
Copilot reviewed 24 out of 24 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| plugins/markdown/plugin-markdown-preview/src/shared/index.ts | Re-export shared locale types |
| plugins/markdown/plugin-markdown-preview/src/node/preview.ts | Implement preview container rendering via Markdown-It |
| plugins/markdown/plugin-markdown-preview/src/node/options.ts | Define plugin options interface |
| plugins/markdown/plugin-markdown-preview/src/node/markdownPreviewPlugin.ts | Main plugin registration and locale setup |
| plugins/markdown/plugin-markdown-preview/src/node/locales.ts | Default locale entries for preview toggle |
| plugins/markdown/plugin-markdown-preview/src/node/index.ts | Node entry exports |
| plugins/markdown/plugin-markdown-preview/src/client/styles/vp-preview.scss | Styles for preview component |
| plugins/markdown/plugin-markdown-preview/src/client/styles/vars.css | CSS variables for preview |
| plugins/markdown/plugin-markdown-preview/src/client/index.ts | Client entry exports |
| plugins/markdown/plugin-markdown-preview/src/client/config.ts | Client configuration (Vue component registration) |
| plugins/markdown/plugin-markdown-preview/src/client/components/index.ts | Component exports for VPPreview |
| plugins/markdown/plugin-markdown-preview/src/client/components/VPPreview.ts | Vue component definition for preview |
| plugins/markdown/plugin-markdown-preview/rollup.config.ts | Rollup bundling configuration |
| plugins/markdown/plugin-markdown-preview/package.json | Plugin metadata and dependencies |
| docs/zh/plugins/markdown/markdown-preview.md | Chinese documentation for the plugin |
| docs/plugins/markdown/markdown-preview.md | English documentation for the plugin |
| docs/package.json | Register new plugin as a workspace dependency |
| docs/.vuepress/configs/sidebar/zh.ts | Add plugin page to Chinese sidebar |
| docs/.vuepress/configs/sidebar/en.ts | Add plugin page to English sidebar |
| docs/.vuepress/configs/plugins.ts | Enable plugin in example site config |
Comments suppressed due to low confidence (1)
plugins/markdown/plugin-markdown-preview/src/shared/index.ts:1
- The syntax
export type * from './locales.js'is invalid. Useexport * from './locales.js'or explicitly list type exports withexport type { ... } from './locales.js'.
export type * from './locales.js'
| white-space: nowrap; | ||
| } | ||
|
|
||
| .vp-preview-toggle-button { |
There was a problem hiding this comment.
[nitpick] The selector .vp-preview-toggle-button is defined twice (lines 51–68 and 121–123). Consider merging these blocks to reduce duplication.
Copilot uses AI. Check for mistakes.
| } | ||
| } | ||
|
|
||
| .vp-preview-toggle-button { |
There was a problem hiding this comment.
[nitpick] This second definition of .vp-preview-toggle-button only sets the --icon variable; it could be merged with the first block for clarity.
Copilot uses AI. Check for mistakes.
| { | ||
| 'type': 'button', | ||
| 'class': 'vp-preview-toggle-button', | ||
| 'title': locale.value.toggle, |
There was a problem hiding this comment.
Consider adding an explicit aria-label attribute alongside title on the toggle button to ensure screen readers announce the control correctly.
Copilot uses AI. Check for mistakes.
| openRender: (tokens, index) => | ||
| `<VPPreview title="${escapeHtml(tokens[index].info)}">\n`, | ||
| codeRender: (tokens, index, options, _env, self) => { | ||
| const token = tokens[index] |
There was a problem hiding this comment.
Mutating the original token can lead to side effects in subsequent render passes. Consider cloning the token before making changes.
| const token = tokens[index] | |
| const originalToken = tokens[index] | |
| const token = { ...originalToken } |
Copilot uses AI. Check for mistakes.
3 participants
No description provided.