Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/chaimayor/hview-ui
Hview UI - A Vue.js 3 UI library 👻
https://github.com/chaimayor/hview-ui
hview-ui less markdown typescript vue vue3
Last synced: 3 months ago
JSON representation
Hview UI - A Vue.js 3 UI library 👻
- Host: GitHub
- URL: https://github.com/chaimayor/hview-ui
- Owner: ChaiMayor
- License: mit
- Created: 2023-01-13T02:57:11.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2023-07-24T03:16:36.000Z (over 1 year ago)
- Last Synced: 2024-10-01T03:08:37.935Z (4 months ago)
- Topics: hview-ui, less, markdown, typescript, vue, vue3
- Language: Vue
- Homepage: https://chai-mayor.gitee.io/hview-ui
- Size: 22.1 MB
- Stars: 91
- Watchers: 3
- Forks: 8
- Open Issues: 1
-
Metadata Files:
- Readme: README-EN.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
## 🎃 Intro
Hview is a Minimalism style computer side component library developed based on `Vue3`, fully embrace `Vue3` ecology, maintained by `Wuhu Takeoff` team.
## ✨ Features
- 🚀 Provides 30+ high quality common components
- 💪 Developed by Chinese people, perfect documentation and logistics support in both Chinese and English
- 🛠️ Support on demand import, reduce packaging volume
- 🛠️ Support theme customization
- 🌍 Support internationalization
- 🎯 Built in TypeScript, complete type definition files are available
- 🛠️ Support dark mode
- 🤺 It's a drill ground. It could be useful
- 🔐 Ensure over 80% unit test coverage to ensure stability, safety and reliability
## 📦 Install
```bash
npm i hview-plus
```## 🤹♀️ Used
```js
// main.ts
import { createApp } from "vue";
import HviewPlus from "hview-plus";
import "hview-plus/theme-chalk/style.css";import App from "./App.vue";
const app = createApp(App);
app.use(HviewPlus);
app.mount("#app");
```Project document:[chai-mayor.gitee.io/hview-ui](https://chai-mayor.gitee.io/hview-ui)
## 🤺 Playground
Edit components online at [Hview UI Playground](https://playground.zhishiyu.online/)
> Sometimes, component registration may fail, and you can refresh the page to recover
## 🥇 Technology stack
Core:vue3 + typescript + less + vite
Submit:husky、commitlint、lint-staged
Genre:eslint、prettier、stylelint、postcss-less
Dir:ls-lint
Document:vitepress
I18n:vue-i18n
Test:vitest、@vue/test-utils、jsdom、c8
CI/CD:gulp、github actions、release-it
## 🎪 Project case
Project name:Hview-ui
Implied meaning:Usually, the first code to learn programming is Hello World, and it is the first time for us to develop component libraries. Our component libraries are also developed and learned by referring to existing component libraries. view has the meaning of observation and is a homophone with vue, so we combine h and view together. Naming the component library hview-ui means that our new component library will learn the advantages of integrating existing component libraries and hopefully present a good component library project for you.
Logo:
Design:view also means perspective, view. Here, three patterns in different view directions are used to form the solid H
Implied meaning:There are still many imperfections in our component library. We sincerely hope that the majority of developers can use our component library and give us feedback and questions. We will humbly accept and then accept your opinions, and continue to iterate the project that satisfies the developers.
## 👋 Contributors
Thanks for all their contributions 🐝!
## 🎑 Join us
By using the fly book scan code to join the development group chat, later in the group to share the knowledge of the development of the component library, how to solve the problems encountered, as well as the development process introduction and so on...
Those who have the ability and ideas can participate in our open source project after completing and submitting the development of the three components according to the introduction
For those who have ideas but don't have the ability at present, we will provide some article materials of component library in the group. We hope you can participate in the development of our project after learning and practicing
Finally, I hope you can make a fortune and give us a free star. Thank you again 😘
> Reference article:How do I contribute code to an open source project? - zhihu.com
## 🌸 Thanks
The project draws on the following projects.
- [Element Plus](https://element-plus.gitee.io/zh-CN/component/button.html)
- [kitty-ui](https://gitee.com/geeksdidi/kittyui)
- [brain-ui](https://github.com/longyanjiang/brain-ui)## 📄 License
[MIT License](https://opensource.org/licenses/MIT) © 2023-PRESENT [ChaiMayor](https://github.com/NelsonYong)