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 🙏

© 2026 – Pkg Stats / Ryan Hefner

xhh-design

v0.0.0-dev.23

Published

A Component Library for Vue 3

Readme

模板来自 element-plus

  1. 替换所有的 element-plus 为 xhh-design 包括文件名,文件夹名,代码中的字符串,驼峰写法也要替换
  2. 运行发现报错,将部分 xhh-design 替换回去,包括 xhh-design/icon-vue,unplugin-xhh-design 等
  3. 删除多余的代码,element-plus 以往的组件,保留 base 和 config-provider

2023-10-30:

  • 通用问题,需要持续改进
  1. 将多余的 css 去掉
  2. 类型声明需要优化:1. 编写新的类型 2. 将 any 替换成有意义的类型
  • 问题 1
  1. 在 src 目录下有 form.ts 文件,但是在导入 ts 文件时,会提示错误,但是不论哪中错误,程序都能正确运行,只是编辑器会提示错误而已
    1. 若导入语句是 import Form from './src/index' 则提示 TS2307: Cannot find module './src/index' or its corresponding type declarations
    2. 若导入语句是 import Form from './src/table.ts' 则提示 TS2691: An import path cannot end with a '.ts' extension. Consider importing './src/index.js' instead

此问题已经解决:当文件是 table.ts 时,导入语句应该是 import Form from './src' 也就是说后边的 index 应该省略

  • 问题 2
  1. rules 不生效
  2. 解决:form-item 组件需要传入 prop 属性才能生效
  • 问题 3
  1. form 的值变化后,不重新渲染不生效
  2. 在 form.item 组件中,需要监听 itemValue,并给 value 进行赋值,才能将值传递下去,注意这里的 watch 必须使用 get 方法的形式

2023-10-31

table 组件,罗列出需要改的点

  1. 表格的高度适应页面
  2. 表格是否可以虚拟滚动
  3. 表格的列是否可以被设置隐藏显示

2023-11-03

规划

  • 表格列的配置 ✅
  • 表格操作按钮
  • 表格与表单合并
  • 根据配置生成增删改查功能
  • 相同的请求同时发送时需要合并请求
  • 请求可以被取消

小功能列表

  • 配置按钮出现在表头,以设置按钮的形式出现,并且可以在配置界面被配置到哪个列上,显示配置按钮的细节:
    • 配置按钮只能在一个列上显示
    • 设置了配置按钮的列无法被隐藏
  • 操作列中有上传按钮
  • 操作列中有二次确认按钮

反思

  • 重要的不是这些页面的奇技淫巧,而是根据这些页面的增删改查能实现什么业务场景,当放在实际的业务场景时,这样的页面功能能有多大的作用

接下来,融合 form 与 table,使用 table 组件,直接实现同质化的增删改查

2023-11-10

  1. 不要在 vue 文件中写 style,也不要引入 style,否则会出现编译异常(能正常运行)

2024-01-26

  1. 发版流程,本地登录 npm; npm login
  2. 修改版本号,修改 lib 下的 package.json 的版本号,再修改 packages 下的 package.json 的版本号
  3. 执行 yarn b
  4. 进入到 dist/xhh-design 执行 npm publish

2024-02-01

发版时如果遇到问题: npm cache clean --force cd ~ ll rm -rf .npm npm log npm help rm -rf ~/.npmrc npm config list npm config delete registry npm config ls -l npm login npm publish

尝试删除以前的配置,在输入 npm login 时出现输入用户名密码邮箱时即可成功发版

方法 2 连接个人热点,执行 npm login 再执行 npm publish

方法 3 10831 npm config set registry https://registry.npmmirror.com 10833 npm config set registry https://registry.npmjs.org/

切换了一下这个源

切换了一下网络

执行了 npm config delete registry

npm cache clean --force

再次执行 npm login

检查版本是否已经同步 npm view xhh-design version cnpm view xhh-design version

2024-02-23

安装最新的 nodejs 18.19.1 之后,无法启动了

尝试,切换成 16.18.0 成功启动了

0308 需要编写详细的文档,每一个属性都要有 demo 能够覆盖

2024-06-05

发布流程:

  1. packages/xhh-design/version.ts 修改版本号 一般都是版本号+1

  2. packages/xhh-design/package.json 修改版本号

  3. yarn b 以下是执行成功后的打印

    ...
    [11:08:15] Finished 'copyFiles' after 2.19 ms
    [11:08:16] Finished 'copyTypes:esm' after 364 ms
    [11:08:16] Finished 'copyTypes:cjs' after 364 ms
    [11:08:16] Finished 'copyTypesDefinitions' after 365 ms
    [11:08:16] Finished 'default' after 1.02 min
    ✨  Done in 74.03s.
    
  4. 执行 npm login,以下是正常登录的情况展示:登录密码:5 sh6 56

     ± npm login
    npm WARN adduser `adduser` will be split into `login` and `register` in a future version. `adduser` will become an alias of `register`. `login` (currently an alias) will become its own command.
    npm notice Log in on https://registry.npmjs.org/
    Username: fuybooo
    Password:
    Email: (this IS public) [email protected]
    npm notice Please check your email for a one-time password (OTP)
    Enter one-time password: 58047608
    Logged in as fuybooo on https://registry.npmjs.org/.
    
  5. 经常会遇到登录不上的情况,切换一下网络,等操作之后再试试

  6. cd 到 dist/xhh-design

  7. 执行 npm publish

    当看到如下提示时,即发布成功
    Publishing to https://registry.npmjs.org/ with tag latest and public access
    + xhh-design@xxx 这里是当前发布的版本
  8. 检查版本是否已经同步

    npm view xhh-design version
    cnpm view xhh-design version
  9. 如果 cnpm view xhh-design version 输出了最新版本,则可以使用 cnpm 下载,一般需要等一段时间才会同步

2024-07-25

  1. 想到的新功能:
    1. 表格查询条件保持,切换页面后,切回来时(返回等操作)保持查询条件
    2. 表格选中项保持记住,切换页面后,切回来(返回等操作)保持记住
    3. 表格选中项保持,例如选中某几项,输入查询条件进行搜索后,再次选中时,需要将这些选中的都记录

2024-07-26

  1. element-plus 版本升级 2.4.1 -> 2.7.7
  2. vue 版本升级 3.3.7 -> 3.4.34

2024-09-05

  1. 表单的其他形态:readonly disabled

2024-09-08

  1. 新想到要添加的功能:
    1. 使用键盘操作,切换元素等