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

webmat

v0.2.2

Published

Formats your entire project with clang-format

Downloads

6,494

Readme

🕸💎 webmat 💎🕸

web + format = webmat. It formats your web projects!

⚠️ Warning: Still under early development ⚠️

Webmat is still under development and you may run into issues. Issues may range from a lot of memory usage to ruining your project. Use at your own risk for now.

💡 Highlights

  • 🌎 Formats multiple files at once using an include / exclude glob api
  • 🔭 Searches through HTML files and formats only the script tags with contents
  • 🐀 Vaugely sounds like the word "wombat"

webmat is a formatter will run mulitple files in your project through a formatter (currently only clang-format). It will gather all the js, ts, and html files and format them in place. The trick of this pony is that it will format your HTML files by gathering their script tags, formatting them, and replacing only your script tags without touching the rest of your DOM.

Usage

Install webmat from npm:

npm install -g webmat

Simple usage

webmat will select files to format based off of a default set of globs defined in default_config.json. If those defaults are fine, then you can simply run:

webmat

File Selection

If you would like to include or exclude files not included by the default config, then you can specify a set of globs in a formatconfig.json file in the directory that you are running webmat. An example:

{
  "include": [ "protos/*.proto", "wasm/**/*.cpp" ],
  "exclude": [ "generated_files/**/*", "formatter-mangles-my-code.html" ]
}

webmat will simply append your custom config to the default config and then select files using fast-glob's set of selection rules. fast-glob's reading algorithm will run the excludes first, so if you want to format a file that is in the default config's exclude list, then you will have to add the ignoreDefaultGlobs flag to completely ignore the default include / exclude configurations.

API

I haven't totally made this user friendly yet, please come back later!

Options

There are currently no command-line flags only formatconfig.json.

formatconfig.json

Types:

{
  include: string[],
  exclude: string[],
  ignoreDefaultGlobs: boolean
}

Descriptions:

| property | description | | -------- | ----------- | | include | List of globs to include in format selection | | exclude | List of globs to exclude from format selection | | ignoreDefaultGlobs | Completely ignores default include / exclude globs |