{"id":14977020,"url":"https://github.com/fightingdesign/fighting-design","last_synced_at":"2025-05-15T14:08:09.031Z","repository":{"id":36991938,"uuid":"499571922","full_name":"FightingDesign/fighting-design","owner":"FightingDesign","description":"🌈 Fighting Design 可在 vue3 应用程序中快速构建交互界面，看起来还不错。(🌈 Fighting design can quickly build interactive interfaces in vue3 applications, which looks good.)","archived":false,"fork":false,"pushed_at":"2024-09-10T12:30:53.000Z","size":94340,"stargazers_count":572,"open_issues_count":2,"forks_count":162,"subscribers_count":11,"default_branch":"master","last_synced_at":"2025-05-15T14:07:56.868Z","etag":null,"topics":["componets","css3","design","es6","eslint","fighting","fighting-design","javascript","js","rollup","sass","setup","ts","typescript","vite","vitejs","vitepress","vitest","vue3","vuejs"],"latest_commit_sha":null,"homepage":"https://fighting.tianyuhao.cn","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/FightingDesign.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.en-US.md","contributing":"CONTRIBUTING.en-US.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":"SECURITY.md","support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":["Tyh2001"],"open_collective":["FightingDesign"]}},"created_at":"2022-06-03T16:04:48.000Z","updated_at":"2025-05-13T01:38:57.000Z","dependencies_parsed_at":"2023-12-27T11:27:41.804Z","dependency_job_id":"d8853192-1070-4d8f-9990-4a2399fb36f8","html_url":"https://github.com/FightingDesign/fighting-design","commit_stats":{"total_commits":3708,"total_committers":54,"mean_commits":68.66666666666667,"dds":0.09843581445523197,"last_synced_commit":"338bde1f7816cd5208254a97e7454a9809c745ad"},"previous_names":[],"tags_count":183,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/FightingDesign%2Ffighting-design","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/FightingDesign%2Ffighting-design/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/FightingDesign%2Ffighting-design/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/FightingDesign%2Ffighting-design/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/FightingDesign","download_url":"https://codeload.github.com/FightingDesign/fighting-design/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254355335,"owners_count":22057354,"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":["componets","css3","design","es6","eslint","fighting","fighting-design","javascript","js","rollup","sass","setup","ts","typescript","vite","vitejs","vitepress","vitest","vue3","vuejs"],"created_at":"2024-09-24T13:54:53.331Z","updated_at":"2025-05-15T14:08:03.993Z","avatar_url":"https://github.com/FightingDesign.png","language":"TypeScript","readme":"\u003cp align=\"center\"\u003e\n  \u003cimg height=\"160px\" src=\"https://raw.githubusercontent.com/Tyh2001/images/4ad62a8f00aa2473deca61598f307430d8d4a4cf/fighting-design/FightingDesign.svg\"\u003e\n  \u003ch2 align=\"center\" style=\"font-weight: 600\"\u003eFighting Design\u003c/h2\u003e\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  Fighting design can quickly build interactive interfaces in vue3 applications, which looks good.\n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://github.com/FightingDesign/fighting-design/blob/master/README.zh-CN.md\"\u003eChinese\u003c/a\u003e | English \n\u003c/p\u003e\n\n\u003cp align=\"center\"\u003e\n  \u003ca href=\"https://github.com/FightingDesign/fighting-design/stargazers\"\u003e\u003cimg src=\"https://img.shields.io/github/stars/FightingDesign/fighting-design\" /\u003e\u003c/a\u003e\n  \u003ca href=\"https://www.npmjs.com/package/fighting-design\"\u003e\u003cimg src=\"https://badgen.net/npm/v/fighting-design\" /\u003e\u003c/a\u003e\n  \u003ca href=\"https://fighting.tianyuhao.cn\"\u003e\u003cimg src=\"https://img.shields.io/badge/Fighting%20Design-Docs-blue\" /\u003e\u003c/a\u003e\n  \u003ca href=\"https://github.com/FightingDesign/fighting-design/blob/master/CHANGELOG.md\"\u003e\u003cimg src=\"https://img.shields.io/badge/Fighting%20Design-CHANGELOG-blue\" /\u003e\u003c/a\u003e\n\u003c/p\u003e\n\n## ✨ Features\n\n- 🪐 60+ common components\n- 💪 Developed with the latest features of Vue.js\n- 🐆 Fully based on Vite, fast enough\n- 🤟 Ultimate development experience\n- 🥇 Ultra detailed JSDoc comments\n- 🦩 Zero third party dependency\n- 🪐 Different packaging modes which compatible with different projects\n- 🏆 Support full import and on-demand import\n- ✅ Written with TypeScript \u0026 Template\n- 🖍️ Strict TypeScript Type\n- ✔️ Easy to configure and easy to use\n- 🚩 Complete and adequate unit tests\n- 👍 Maintained by the community team\n- ❤️ Developed according to actual demand\n- 📃 High quality detailed documentation\n- ☝️ Put forward demands and keep improving\n- 🌍 More configuration options \u0026 flexible components\n- 🛠 More features are under development\n\n## 🔑 Install\n\nUse `pnpm` install\n\n```shell\npnpm add --save-dev fighting-design\n```\n\nUse `npm` install\n\n```shell\nnpm install --save-dev fighting-design\n```\n\nUse `yarn` install\n\n```shell\nyarn add --save-dev fighting-design\n```\n\n## 🎉 Quick Start\n\nPut the following code into `main.ts`\n\n```ts\nimport { createApp } from 'vue'\nimport App from './App.vue'\n\nimport FightingDesign from 'fighting-design'\nimport 'fighting-design/dist/index.css'\n\nconst app = createApp(App)\napp.use(FightingDesign)\napp.mount('#app')\n```\n\n## 🪂 Quick experience\n\n```html\n\u003chead\u003e\n  \u003clink\n    rel=\"stylesheet\"\n    href=\"https://cdn.jsdelivr.net/npm/fighting-design/dist/index.css\"\n  /\u003e\n\u003c/head\u003e\n\n\u003cbody\u003e\n  \u003cdiv id=\"app\"\u003e\n    \u003cf-space\u003e\n      \u003cf-button round type=\"default\"\u003e默认按钮\u003c/f-button\u003e\n      \u003cf-button round type=\"primary\"\u003e主要按钮\u003c/f-button\u003e\n      \u003cf-button round type=\"success\"\u003e成功按钮\u003c/f-button\u003e\n      \u003cf-button round type=\"danger\"\u003e危险按钮\u003c/f-button\u003e\n      \u003cf-button round type=\"warning\"\u003e警告按钮\u003c/f-button\u003e\n    \u003c/f-space\u003e\n\n    \u003cf-divider\u003e华丽的分隔线\u003c/f-divider\u003e\n\n    \u003cf-button type=\"primary\" @click=\"visible = true\"\u003e打开 Dialog\u003c/f-button\u003e\n    \u003cf-dialog title=\"Title\" v-model:visible=\"visible\"\u003e\n      欢迎使用 Fighting Design！\n    \u003c/f-dialog\u003e\n  \u003c/div\u003e\n\n  \u003cscript src=\"https://cdn.jsdelivr.net/npm/vue/dist/vue.global.js\"\u003e\u003c/script\u003e\n  \u003cscript src=\"https://cdn.jsdelivr.net/npm/fighting-design/dist/index.umd.js\"\u003e\u003c/script\u003e\n  \u003cscript\u003e\n    const { createApp, ref } = Vue\n\n    const app = createApp({\n      setup() {\n        const visible = ref(false)\n\n        return { visible }\n      }\n    })\n\n    app.use(FightingDesign.default)\n    app.mount('#app')\n  \u003c/script\u003e\n\u003c/body\u003e\n```\n\n## 🐳 Related links\n\n- [Official documents](https://fighting.tianyuhao.cn)\n- [NPM](https://www.npmjs.com/package/fighting-design)\n- [CONTRIBUTING](https://github.com/FightingDesign/fighting-design/blob/master/CONTRIBUTING.md)\n- [CHANGELOG](https://github.com/FightingDesign/fighting-design/blob/master/CHANGELOG.md)\n\n## 🌈 Join Fighting Design\n\nAdd WeChat \u0026 please note the `Github` username\n\n\u003cimg width=\"200\" height=\"264\" src=\"https://raw.githubusercontent.com/Tyh2001/images/master/my/we-chat-2.jpg\" \u003e\n\n## 💌 Special Thanks\n\nThanks to [everyone](https://github.com/FightingDesign/fighting-design/graphs/contributors) who has already contributed to `Fighting Design`!\n\n\u003ca href=\"https://github.com/FightingDesign/fighting-design/graphs/contributors\"\u003e\n  \u003cimg src=\"https://contrib.rocks/image?repo=FightingDesign/fighting-design\" /\u003e\n\u003c/a\u003e\n\n## 💬 LICENSE\n\n[MIT](https://github.com/FightingDesign/fighting-design/blob/master/LICENSE)\n","funding_links":["https://github.com/sponsors/Tyh2001","https://opencollective.com/[\"FightingDesign\"]"],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffightingdesign%2Ffighting-design","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffightingdesign%2Ffighting-design","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffightingdesign%2Ffighting-design/lists"}