{"id":19675295,"url":"https://github.com/zhongantech/zarm-vue","last_synced_at":"2025-04-07T12:03:30.575Z","repository":{"id":24222349,"uuid":"100860673","full_name":"ZhongAnTech/zarm-vue","owner":"ZhongAnTech","description":"zarm in Vue.js","archived":false,"fork":false,"pushed_at":"2022-12-10T16:53:42.000Z","size":28164,"stargazers_count":129,"open_issues_count":23,"forks_count":46,"subscribers_count":12,"default_branch":"master","last_synced_at":"2025-03-31T11:03:08.976Z","etag":null,"topics":["vue","zarm","zarm-vue"],"latest_commit_sha":null,"homepage":"https://vue.zarm.design/#/documents/quick-start","language":"JavaScript","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/ZhongAnTech.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-08-20T12:42:17.000Z","updated_at":"2025-01-10T09:36:38.000Z","dependencies_parsed_at":"2023-01-14T07:45:25.781Z","dependency_job_id":null,"html_url":"https://github.com/ZhongAnTech/zarm-vue","commit_stats":null,"previous_names":[],"tags_count":73,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ZhongAnTech%2Fzarm-vue","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ZhongAnTech%2Fzarm-vue/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ZhongAnTech%2Fzarm-vue/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ZhongAnTech%2Fzarm-vue/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ZhongAnTech","download_url":"https://codeload.github.com/ZhongAnTech/zarm-vue/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247648874,"owners_count":20972944,"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":["vue","zarm","zarm-vue"],"created_at":"2024-11-11T17:23:00.853Z","updated_at":"2025-04-07T12:03:30.536Z","avatar_url":"https://github.com/ZhongAnTech.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"\u003cp align=\"center\"\u003e\n  \u003ca href=\"http://zarm.design\"\u003e\n    \u003cimg width=\"200\" src=\"https://zarm.design/images/logo.732d9561.svg\"\u003e\n  \u003c/a\u003e\n\u003c/p\u003e\n\n\u003ch1 align=\"center\"\u003eZarm Vue\u003c/h1\u003e\n\n\u003cdiv align=\"center\"\u003e\n\n[![Build Status](https://www.travis-ci.org/ZhongAnTech/zarm-vue.svg?branch=master)](https://www.travis-ci.org/ZhongAnTech/zarm-vue)\n[![Coverage Status](https://img.shields.io/coveralls/ZhongAnTech/zarm-vue/master.svg)](https://coveralls.io/github/ZhongAnTech/zarm-vue?branch=master)\n[![Netlify Status](https://api.netlify.com/api/v1/badges/db2483a3-5b1a-4e48-8e37-9cc56332be2d/deploy-status)](https://app.netlify.com/sites/zarm-vue/deploys)\n[![npm package](https://img.shields.io/npm/v/zarm-vue)](https://www.npmjs.org/package/zarm-vue)\n[![NPM downloads](https://img.shields.io/npm/dt/zarm-vue)](https://img.shields.io/npm/dt/zarm-vue)\n![JS gzip size](http://img.badgesize.io/https://unpkg.com/zarm-vue@latest/zarm-vue.umd.js?compression=gzip\u0026label=gzip%20size:%20JS)\n![CSS gzip size](http://img.badgesize.io/https://unpkg.com/zarm-vue@latest/zarm-vue.default.css?compression=gzip\u0026label=gzip%20size:%20CSS)\n\u003ca href=\"https://www.npmjs.com/package/zarm-vue\"\u003e\u003cimg src=\"https://img.shields.io/npm/l/zarm-vue.svg\" alt=\"License\"\u003e\u003c/a\u003e\n\n\u003c/div\u003e\n\n### 版本\n\n- Beta版：[![npm package](https://img.shields.io/npm/v/zarm-vue)](https://www.npmjs.org/package/zarm-vue)\n\n- Alpha版：[[ZarmVue-Next]](https://zarm-vue.gitee.io/zarm-vue-next/#/documents/quick-start)\n\n### Install 安装\n\n```bash\nnpm install zarm-vue --save\n```\n\n\n### Import 引入\n\n- 全组件引入\n\n```javascript\nimport Vue from 'vue';\nimport zarmVue from 'zarm-vue';\n// 引入全局样式\nimport 'zarm-vue/zarm-vue.default.css';\nVue.use(zarmVue);\n```\n\n- 按需引入\n\n借助`ElementUI`提供的[babel-plugin-component](https://github.com/ElementUI/babel-plugin-component)，我们可以只引入需要的组件，以达到减小项目体积的目的。\n\n首先，安装 babel-plugin-component：\n\n```bash\nnpm install babel-plugin-component -D\n```\n\n然后，将 .babelrc 添加：\n\n```javascript\n{\n  // ...\n  \"plugins\": [[\"component\", {\n      \"libraryName\": \"zarm-vue\",\n      \"styleLibraryName\": \"theme\"\n    }\n  ]]\n}\n```\n\n\n接下来，如果你只希望引入部分组件，比如 Button 和 Alert，那么需要在 main.js 中写入以下内容：\n\n```javascript\nimport { Button, Alert } from 'zarm-vue'\nVue.use(Button)\nVue.use(Alert)\n```\n\n\n- 也可以通过cdn引入umd模块\n```html\n\u003c!DOCTYPE html\u003e\n\u003chtml\u003e\n\u003chead\u003e\n  \u003cmeta charset=\"UTF-8\"\u003e\n  \u003c!-- import CSS --\u003e\n  \u003clink rel=\"stylesheet\" href=\"https://unpkg.com/zarm-vue@latest/zarm-vue.default.css\"\u003e\n  \u003cscript src=\"https://unpkg.com/vue@latest/dist/vue.min.js\"\u003e\u003c/script\u003e\n  \u003cscript src=\"https://unpkg.com/zarm-vue@latest/zarm-vue.umd.js\"\u003e\u003c/script\u003e\n\u003c/head\u003e\n\u003cbody\u003e\n  \u003cdiv id=\"app\"\u003e\n      \u003cza-button theme=\"primary\"\u003e普通按钮\u003c/za-button\u003e\n  \u003c/div\u003e\n\u003c/body\u003e\n\u003cscript\u003e\n  new Vue({\n    el: '#app'\n  })\n\u003c/script\u003e\n\u003c/html\u003e\n\n```\n\n\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzhongantech%2Fzarm-vue","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fzhongantech%2Fzarm-vue","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fzhongantech%2Fzarm-vue/lists"}