npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

snell-ui

v0.0.1

Published

UI framework,fast and easy create page.

Downloads

4

Readme

snell

snell: /snɛl/, 意为敏捷的;精明的;厉害的;锐利的

基于element,快速构建界面的ui库,她再也不会苦苦等我下班了

工程化思路

  • [ ] 使用pnpm创建monorepo管理各个子模块

  • [ ] 使用rollup打包项目,做好treeshaking,支持css和js单独引用,排除vue和element-ui

  • [ ] 使用sass编写样式,支持css变量定义主题

  • [ ] 使用vuepress渲染md文档,并且编写插件支持在线编辑实时预览效果,可能还需要编写主题

  • [ ] 使用karma编写单元测试

  • [ ] 使用GitHub Action 自动打包发布,文档更新,跑单元测试

代码思路

  • [ ] 主要用配置项描述UI界面,可以通过slot和render函数进行自定义渲染

  • [ ] 跟elementUI的API保持一致,中划线改小驼峰,组件划分尽量细致,保证组件性能

  • [ ] 能设计默认值的必须设计合理的默认值,并且所有默认值尽可能的全局自义定

  • [ ] 核心组件如何设计: TableFormDetialEditTbaleCRUDGroup

  • [ ] 各个组件的combo如何整合,HOC?render?v-if?

  • [ ] CRUD组件如果传入接口交互方法,和出入参数据处理函数来操作增删改查等基础操作,如果pageination不为false,还要整合分页逻辑,如果传入了路由配置则带上参数进行路由跳转,什么都没传的时候抛出事件。此外还有支持默认权限、虚拟滚动,动态列,隐藏查询,以及全部的el-table功能

  • [ ] 表单组件的联动如何设计? 传入如下配置:reaction:{ deps: [...], action: (data) => {...} } ,不传action的时候走默认联动:如果是配置request相关属性(url,methed,params,error),则触发重新请求(实现方式:链表?MAP?)

  • [ ] 全局配置的设计,例如:设置request请求工具方法,默认接口的数据的取值,默认展示文本的字段,默认传值字段。表格单元格和查看组件空数据展示--?配置项schema提示?等等。。。

  • [ ] 支持注入自定义组件,后续直接通过配置渲染出来(自定义组件是否需要符合设计规范?)

  • [ ] 支持国际化翻译,并且支持自定义翻译

  • [ ] 主题配置,支持暗黑模式

  • [ ] 文档设计需要斟酌,如何直观的展示组件的各项功能:

    • 类似后管界面?
    • 动态支持页面增加?
    • tag页签交互?
    • 实时展示配置代码且可以修改并触发页面更新?
    • 支持界面设计器
    • 支持直接导出.vue文件