Elenext(WIP)

A Vue.js 3.0 UI Toolkit for Web

Foreword

The purpose of this project is not to copy Element2 and translate it using Vue3, and compatibility is not a priority

If you are used to Element2 and want to use it under Vue3, we recommend moving to Element Plus.

This project implements a more modern browser-compliant UI framework that makes extensive use of various new features.

Features

• zero-configuration bundler for vue3 components ==> tsrv
  • [x] tsrv dev/build
  • [x] tsrv test
• vite docs/demo stie ==> vite-plugin-vuedoc
  • [x] docs stie
  • [x] support markdown
  • [x] demo preview
• prop types definitions ==> vptypes
  • [x] typescript support
  • [x] basic check
• style
  • [x] Reconfiguration style
  • [x] use css variables
• components
  • [] something

Docs & Demo

https://elenext.vercel.app

Install

yarn add elenext

Quick Start

import 'elenext/dist/elenext.css'
import { createApp } from 'vue'
import elenext from 'elenext'
import App from './App.vue'

const app = createApp(App)

app.use(elenext)
app.mount('#app')

For more information, please refer to Quick Start in our documentation.

Browser Support

Modern browsers and Internet Explorer 11+.

Development

Skip this part if you just want to use Elenext.

Todo

✨ 组件库 ✨

• [x] Grid
  • [x] ERow
  • [x] ECol
• [x] Layout
  • [x] ELayout
  • [x] EMain
  • [x] EAside
  • [x] EFooter
  • [x] EHeader
• [x] Button
  • [x] EButton
  • [x] EButtonGroup
• [x] ELink
• [x] EBreadcrumb
  • [x] EBreadcrumbItem
• [x] EPagination
• [x] Icon
• [x] EAlert
• [x] EPopper
• [x] ETooltip
• [x] EPopover
• [x] Menu
  • [x] EMenu
  • [x] ESubMenu
  • [x] EMenuItem
  • [x] EMenuItemGroup
• [x] EInput
  • [x] EInputGroup
• [x] radio
• [x] checkbox
• [ ] card
• [ ] date-picker
• [ ] dialog
• [ ] divider
• [ ] drawer
• [ ] dropdown
• [ ] form
• [ ] image
• [ ] loading
• [ ] message
• [ ] notification
• [ ] option
• [ ] pagination
• [ ] progress

Additional Tools

• tsrv Zero Configuration bundler for vue3 components

• vite-plugin-vuedoc Markdown document preview and code highlighting for vite

• vptypes Vue3 Prop Types definitions

Author

👤 jaskang

• Website: https://github.com/jaskang

Show your support

Give a ⭐️ if this project helped you!