{"id":13672762,"url":"https://github.com/Tencent/tmagic-editor","last_synced_at":"2025-04-28T03:32:55.807Z","repository":{"id":36968589,"uuid":"460314453","full_name":"Tencent/tmagic-editor","owner":"Tencent","description":null,"archived":false,"fork":false,"pushed_at":"2025-04-21T12:37:48.000Z","size":31895,"stargazers_count":4685,"open_issues_count":61,"forks_count":773,"subscribers_count":70,"default_branch":"master","last_synced_at":"2025-04-22T17:59:43.768Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Tencent.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","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-02-17T06:46:16.000Z","updated_at":"2025-04-22T10:02:41.000Z","dependencies_parsed_at":"2024-05-29T13:04:01.908Z","dependency_job_id":"b6c25117-9264-4dd9-876f-3d2d1c4654d5","html_url":"https://github.com/Tencent/tmagic-editor","commit_stats":null,"previous_names":[],"tags_count":195,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tencent%2Ftmagic-editor","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tencent%2Ftmagic-editor/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tencent%2Ftmagic-editor/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Tencent%2Ftmagic-editor/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Tencent","download_url":"https://codeload.github.com/Tencent/tmagic-editor/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250580730,"owners_count":21453535,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":[],"created_at":"2024-08-02T09:01:46.787Z","updated_at":"2025-04-28T03:32:50.792Z","avatar_url":"https://github.com/Tencent.png","language":"TypeScript","readme":"# TMagic\nTMagic 可视化搭建平台。\n\n* 💪 Vue 3.0 Composition API\n* 🔥 Written in TypeScript\n\n# 文档\n\n文档请移步 https://tencent.github.io/tmagic-editor/docs/index.html\n\n目前文档仍在逐步完善中，如有疑问欢迎给我们提 issue。\n\n# Playground 体验\n\nhttps://tencent.github.io/tmagic-editor/playground/index.html\n\n## 环境准备\n\nnode.js \u003e= 18\n\npnpm \u003e= 9\n\n先安装 pnpm\n\n```bash\n$ npm install -g pnpm\n```\n\n然后安装依赖\n\n```bash\n$ pnpm bootstrap\n```\n\n## 运行项目\n\n执行命令\n\n```bash\n$ pnpm playground\n```\n\n最后在浏览器中打开\n\nhttp://localhost:8098/tmagic-editor/playground/\n\n即可得到一个魔方编辑器示例项目\n\n## magic-admin\n\n已迁移至 https://github.com/vft-magic/tmagic-admin\n\n## 项目介绍\n在本项目中，我们核心内容，是包含在 `packages/editor` 中的编辑器，以及 `runtime` 和 `packages/ui` 提供的各个前端框架相关的 runtime 和 ui。\n\n- `packages` 目录中提供的内容，我们都以 npm 包形式输出，开发者可以通过安装对应的包来使用。\n- `runtime` 是我们提供的编辑器活动页和编辑器模拟器运行的页面项目示例。可以直接使用，也可以参考并自行实现。\n- `playground` 是一个简单的编辑器项目示例。即使用了 `packages` 和 `runtime` 内容的集成项目。开发者可以参考 playground，使用魔方提供的能力实现一个满足业务方需求的编辑器。\n\n### 编辑器\n通过安装和使用 @tmagic/editor，可以快速搭建起一个魔方编辑器。\n\n\u003cimg src=\"https://image.video.qpic.cn/oa_88b7d-32_509802977_1635842258505918\" alt=\"魔方demo图\"\u003e\n\n### 页面渲染\nruntime 是魔方提供的页面渲染环境。通过加载在编辑器中产出的 DSL，即可得到魔方编辑器希望拥有的最终产物，一个活动页面。我们提供了 vue2/vue3/react 几个版本的 runtime。\n\n通过魔方编辑器和 runtime 渲染，以及通过自定义的复杂组件开发，可以在魔方项目上，搭建出复杂而精美的页面。\n\n\u003cimg src=\"https://image.video.qpic.cn/oa_7cf5e6-5_466783002_1637935497991411\" width=\"375\"\u003e\n\n### 表单渲染\n魔方的表单配置项，使用了我们开发的基于 element-ui 的 @tmagic/form，@tmagic/form 也可以在其他地方单独使用。支持渲染 JS Schema 提供的表单描述。\n\n\u003cimg src=\"https://image.video.qpic.cn/oa_28dbde-2_1333081854_1637935825410557\" \u003e\n\n### 使用\nplayground 的示例项目，就是为开发者提供的基础应用示例。开发者可以基于此或者参考自行实现，搭建一个基于魔方的可视化搭建平台。\n\ntmagic-editor主要定位是搭建生成移动端H5页面，如果有搭建PC端低代码平台的需求，可以了解一下腾讯出品的另外一个低代码平台：[无极低代码平台](https://wujicode.cn?from=tmagic)。\n\n### 参与贡献\n\n如果你有好的意见或建议，欢迎给我们提 Issues 或 Pull Requests，为提升魔方可视化编辑器开发体验贡献力量。\u003cbr\u003e详见：[CONTRIBUTING.md](./CONTRIBUTING.md)\n\n## 贡献者\n\n\u003ca href=\"https://github.com/Tencent/tmagic-editor/graphs/contributors\"\u003e\n  \u003cimg src=\"https://contrib.rocks/image?repo=Tencent/tmagic-editor\" /\u003e\n\u003c/a\u003e\n\n\n### 欢迎入群交流\n\n\u003cimg src=\"https://vfiles.gtimg.cn/vupload/20220412/b85d331649748582992.jpg\" width=375\u003e\n","funding_links":[],"categories":["TypeScript","Low-code","页面搭建","精选 LessCode 项目"],"sub_categories":["Admin Template \u0026 Component Library"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FTencent%2Ftmagic-editor","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FTencent%2Ftmagic-editor","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FTencent%2Ftmagic-editor/lists"}