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

@jarvannnn/utils

v1.5.1

Published

内置工具包

Downloads

3

Readme

utils

License PRs Welcome npm

doc文档

使用说明
// 通过npm安装
npm i --save @jarvannnn/utils

调试说明

npm i

// 自动启动vue2方便调试、新增方法
npm run serve

// 跑单测
npm run test

// 打包生成文档
npm run build

代码补全

前言

  1. 项目中经常会用到某些方法,比如格式化时间戳,比如判断环境等等。
    笔者最初是把这些方法抽离出来写成公共方法,但由于后期项目扩展每次都要复制这个工具文件很是麻烦且效率低下,发布npm包正好解决了这个痛点,正好借此机会重构成ts文件并发布npm包。

  2. 本工具内置vue2.x + ts,方便开发中调试代码。
    本工具包内部集成了lodash的一些方法,详见文档或者src/core/lodash-tool

  3. 本工具使用typedoc根据注释自动生成文档,可搜索方法

  4. 本项目npm包单元测试通过率100%,同时经过公司多个项目沉淀,且稳定运行,大家如有需要可直接下载拓展使用

博客传送门

本文只简要介绍下整个流程,具体项目GitHub,欢迎Start、Fork。thx~ XD

插件

本工具包使用下列插件规范开发,定制团队开发规范

  • eslint
  • tslint
  • prettier
  • commitlint
  • husky

目录结构

.
├── LICENSE
├── README.md
├── docs // typedoc生成的文档
│   ├── assets
│   ├── globals.html
│   ├── index.html
│   └── interfaces
├── gulpfile.js // gulp+rollup配置文件
├── package.json
├── public // vue相关
├── home // vue调试页面
├── src // 代码模块
│   ├── core // 核心代码块
│   │   ├── env.ts
│   │   └── ***.ts
│   ├── index.ts // 入口文件
│   ├── tools
│   │   └── index.ts
│   └── types // 声明文件
│       └── index.ts
├── test // 单元测试
│   ├── core // 核心代码单元测试
│   │   ├── env.spec.ts
│   │   └── ***.spec.ts
│   └── index.spec.ts
├── tsconfig.json // ts配置
├── tslint.json // tslint配置
├── .prettierrc // prettier配置
├── .lintstagedrc // lintstage配置
└── typedoc.json // typedoc配置

100%测试通过率

测试结果

文档输出

  1. 配置typedoc
// package.json  scripts片段
{
  "build": "npm run lint && gulp && typedoc",
}
// typedoc 自动识别根目录下typedoc.json配置文件

版本说明

----------|------------------------
版本号     |  备注
----------|------------------------
v0.0.1    | 基础搭建
v0.1.0    | 新增vue2.x调试
v0.1.2    | 修复bug,维护更新
v1.1.0    | 优化math方法,新增thumbnail, formatToNumber, dealNumber, getGuid方法
v1.1.1    | 开启命名空间
v1.1.2    | 修复thumbnail方法判断,若传入空数组报错的bug
v1.1.3    | 修复throttle、debounce,标识变量移动到函数内部,thumbnail方法支持更大图片格式
v1.1.5    | 新增方法,正常迭代
v1.2.0    | 新增isWxImg,envInfo,isThirdPC方法,兼容多平台和企微头像识别
v1.2.1    | 修复toFixed方法遇见0.1浮点数计算精度出错问题
v1.2.3    | 拓展thumbnail方法
v1.3.0    | 植入lodash方法
v1.3.3    | 拓展lodash方法
v1.3.4    | 节流防抖,新增修饰符
v1.3.5    | envInfo,isThirdPC优化展示方法,返回当前环境
v1.3.6    | thumbnail: 支持API 导入进来的图片不渲染缩略图
v1.4.0    | hexToRgba: 新增16进制转rgba方法
v1.4.1    | thumbnail: 新增1080
v1.5.0    | lodash: 新增_padStart, _padEnd
----------|------------------------

参与贡献

  1. 新建 feature/xxx 分支
  2. 提交代码
  3. 新建 Merge Request