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

webpf

v1.0.6

Published

make webp picture to sequence frame that can be played with canvas

Downloads

3

Readme

webpf

简介

把webp一键转化可用的序列帧动画,产出物包括canvas代码/png雪碧图/json配置文件。此工具依赖于gka,详情请移步这里

运行本程序前,请确保本地已安装gka及模板gka-tpl-canvas。

执行如下命令安装:

npm install gka -g
npm install gka-tpl-canvas -g

安装方法

npm install webpf -g

命令介绍

webp转换成png源图

webpf source -p path

  • path:webp路径
  • 产出物:webp文件同级目录文件夹,包括所有webp文件中png图片
  • 文件夹名称和webp文件相同

webpf sprite -i path

  • path:png源图文件夹
  • 产出物:webp-canvas文件夹,含序列帧播放demo、json配置文件、png雪碧图

webpf fix -p path

  • source/sprite两个子命令的集成体,可直接从webp转化到canvas播放demo
  • path:webp路径

例子

下载项目根目录下lan.webp文件到本地,执行命令wepf fix -p path