https://github.com/liuyunhe/sharp-ui

sharp-ui，一套为开发者准备的基于 Vue 3.0 的桌面端组件库
https://github.com/liuyunhe/sharp-ui

es6 fort-awesome postcss vue3-typescript

Last synced: 4 months ago
JSON representation

sharp-ui，一套为开发者准备的基于 Vue 3.0 的桌面端组件库

• Host: GitHub
• URL: https://github.com/liuyunhe/sharp-ui
• Owner: liuyunhe
• Created: 2024-04-24T06:23:39.000Z (9 months ago)
• Default Branch: main
• Last Pushed: 2024-09-23T01:26:14.000Z (4 months ago)
• Last Synced: 2024-09-28T09:21:46.990Z (4 months ago)
• Topics: es6, fort-awesome, postcss, vue3-typescript
• Language: TypeScript
• Homepage: https://liuyunhe.github.io/sharp-ui/
• Size: 741 KB
• Stars: 2
• Watchers: 1
• Forks: 2
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# sharp-ui

**sharp-ui** 使用最新的 Vue3.4 和 TS 打造的一套网站快速成型工具，地址： [https://liuyunhe.github.io/sharp-ui/](https://liuyunhe.github.io/sharp-ui/)

## 安装

```bash

npm i @shepardliu/sharp-ui --save

```

### 开始使用

>**全局使用**

```js

// 引入所有组件

import SharpUI from '@shepardliu/sharp-ui'

// 引入样式

import '@shepardliu/sharp-ui/dist/index.css'

import App from './App.vue'

// 全局使用

createApp(App).use(SharpUI).mount('#app')

```

```vue

  我是Button

```

>**单个导入**

sharp-ui 提供了基于 ES Module 的开箱即用的 Tree Shaking 功能。

```vue

  我是Button

  import { Button } from '@shepardliu/sharp-ui'

  export default {

    components: { Button },

  }

```

### 课程亮点

* 亮点1 🔥：“稀有”，目前上市面没有类似的高级课程，由浅入深的高仿 Element-Plus 完成组件库开发的全流程。

* 亮点2 💧: “专业”，传授大厂前端项目架构设计思想/开发模式/代码规范/流程，不搞小作坊式代码。

* 亮点3 ⛑️: “全”，精选十几个组件，可以涵盖大部分的主流组件的设计思想以及原理，知识覆盖面全。

* 亮点4 📚：“新”，使用目前2023年 Vue3 周边最新 ，最全技术：Vue3.2 + Typescript4， Vite，Vitest， Vitepress，Vue-test-utils2，Rollup, Postcss 一网打尽。

* 亮点5 🎉：“难”，难度逐渐上升，高薪必备敲门砖，包括：Message - Select - Form 这种高难度高复杂组件。

* 亮点6 🌹：单元测试，被常年忽略但是非常重要的内容，简历加分项，使用最新的 Vitest，Vue-test-utils2 完成单元测试。

* 亮点7 📚:  文档生成工具，组件库打包和发布以及其他周边流程应有尽有，提供一揽子解决方案。

* 亮点8 📦: 长期维护以及更新，会根据同学的反馈每年更新几个高频组件。