{"id":24632717,"url":"https://github.com/weiquanju/vuepress-plugin-demo-code-block","last_synced_at":"2026-06-22T02:31:30.192Z","repository":{"id":57690284,"uuid":"488446395","full_name":"weiquanju/vuepress-plugin-demo-code-block","owner":"weiquanju","description":"vuepress plugin demo block","archived":false,"fork":false,"pushed_at":"2024-03-01T08:54:45.000Z","size":55,"stargazers_count":2,"open_issues_count":4,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-10-22T00:58:52.375Z","etag":null,"topics":["block","code","demo","tsx","vue3","vuepress-plugin"],"latest_commit_sha":null,"homepage":"","language":"Vue","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/weiquanju.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2022-05-04T04:01:59.000Z","updated_at":"2023-03-17T09:57:07.000Z","dependencies_parsed_at":"2025-05-30T23:06:30.592Z","dependency_job_id":"945e64d9-4600-4e43-823d-02fc24e58e26","html_url":"https://github.com/weiquanju/vuepress-plugin-demo-code-block","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/weiquanju/vuepress-plugin-demo-code-block","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/weiquanju%2Fvuepress-plugin-demo-code-block","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/weiquanju%2Fvuepress-plugin-demo-code-block/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/weiquanju%2Fvuepress-plugin-demo-code-block/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/weiquanju%2Fvuepress-plugin-demo-code-block/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/weiquanju","download_url":"https://codeload.github.com/weiquanju/vuepress-plugin-demo-code-block/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/weiquanju%2Fvuepress-plugin-demo-code-block/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":34632514,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-06-22T02:00:06.391Z","response_time":106,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["block","code","demo","tsx","vue3","vuepress-plugin"],"created_at":"2025-01-25T08:12:45.049Z","updated_at":"2026-06-22T02:31:30.169Z","avatar_url":"https://github.com/weiquanju.png","language":"Vue","funding_links":[],"categories":[],"sub_categories":[],"readme":"## vuepress plugin demo code block\n\n支持：vuepress2，vue3，github在线编辑，tsx\n\nsupport: vuepress2, vue3, github edit online, tsx\n\n## 安装 Install\n\n```shell\nnpm i -D vuepress-plugin-demo-code-block\n\nyarn add -D vuepress-plugin-demo-code-block\n\npnpm add -D vuepress-plugin-demo-code-block\n```\n\n## 配置 Config\n\n配置文件： `docs/.vuepress/config.ts`\n\nConfiguration file: `docs/.vuepress/config.ts`\n\n```ts\nimport { defineUserConfig } from 'vuepress'\nimport path from 'path'\nimport demoBlock from 'vuepress-plugin-demo-code-block'\n\nexport default defineUserConfig({\n  plugins: [\n    [\n      demoBlock({\n        componentsDir: new URL(import.meta.url, './../examples'), // 组件目录路径, Component directory path\n        githubEditLinkPath: 'https://github.com/weiquanju/v-el-table-doc/edit/main/docs/examples/', // github编辑地址路径, the path of github edit link \n      })\n    ]\n  ],\n})\n```\n\n\n## 使用 Usage\n\n路径: `docs/examples` 里创建`Hello.vue`\n\nCreate `Hello.vue` in  path of `docs/examples` \n\n```vue\n\u003ctemplate\u003e\n    \u003ch1\u003eHello world!\u003c/h1\u003e\n\u003c/template\u003e\n```\n\n```md\n:::demo\nHello\n:::\n```\n\n### 截图 Screenshot\n\n![Hello.vue example show](https://github.com/weiquanju/vuepress-plugin-demo-code-block/raw/main/.docs/hello.png?1)\n\n![Hello.vue example show](https://github.com/weiquanju/vuepress-plugin-demo-code-block/raw/main/.docs/hello_open.png?1)\n\n## VuePress with tsx\n\n项目配置参考如下\n\nThe project configuration reference is as follows\n\n`tsconfig.json`\n\n```json\n{\n  \"compilerOptions\": {\n    \"baseUrl\": \"./\",\n    \"strict\": true,\n    \"sourceMap\": true,\n    \"resolveJsonModule\": true,\n    \"esModuleInterop\": true,\n    \"target\": \"esnext\",\n    \"module\": \"esnext\",\n    \"moduleResolution\": \"node\",\n    \"isolatedModules\": true,\n    \"jsx\": \"preserve\",\n    \"typeRoots\": [\n      \"node_modules/@types\"\n    ],\n    \"types\": [\n      \"vite/client\",\n      \"@vuepress/client/types\"\n    ],\n    \"lib\": [\n      \"esnext\",\n      \"scripthost\"\n    ],\n  },\n  \"include\": [\n    \"docs/examples/**/*\"\n  ]\n}\n```\n\n`docs/.vuepress/vite.config.ts`\n\n```ts\n\nimport { defineConfig } from 'vite'\nimport vueJsx from '@vitejs/plugin-vue-jsx'\n\n// https://vitejs.dev/config/\nexport default defineConfig({\n  plugins: [\n    vueJsx({\n      transformOn: true,\n    }),\n  ],\n  esbuild: {\n    jsxFactory: 'h',\n    jsxFragment: 'Fragment',\n  },\n})\n\n```\n\n`docs/.vuepress/config.ts`\n\n```ts\nimport { defineUserConfig, defaultTheme } from 'vuepress'\nimport { viteBundler } from '@vuepress/bundler-vite'\nimport path from 'path'\nimport demoBlock from './plugin/vuepress-plugin-demo-block/src'\n\nexport default defineUserConfig({\n  ...\n  bundler: viteBundler({\n    viteOptions: {\n      configFile: path.resolve(__dirname, './vite.config.ts'),\n      // envFile?: false;F\n    },\n    vuePluginOptions: {},\n  })\n  ...\n})\n```","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fweiquanju%2Fvuepress-plugin-demo-code-block","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fweiquanju%2Fvuepress-plugin-demo-code-block","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fweiquanju%2Fvuepress-plugin-demo-code-block/lists"}