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

@paulmillr/jsbt

v0.1.0

Published

JS build tools. Includes tsconfigs, templates and CI workflows

Downloads

698

Readme

@paulmillr/jsbt

Build tools for js projects. Includes tsconfigs, templates and CI workflows

Usage

Copy all files from repo-template when creating a new project. Then, edit EDIT_ME parts in copied files.

Libraries can have different structure. Edit it to your needs:

  • A library can be single-file (index.ts), or multiple-files (src directory)
  • A library can be ESM-only (one tsconfig), or hybrid ESM+Common.js (two tsconfigs)

Make sure to adjust package.json steps: lint, format, test, build and tsconfig

Structure

  • repo-template - files that should be copied when a new repo is created
    • .github - github ci workflows:
      • run npm tests on every commit
      • publish npm package on every release, using GitHub CI and provenance
      • upload standalone build files to github release, from build directory
    • .prettierrc.json, tsconfig.esm.json: prettier and typescript configs
    • LICENSE - MIT license
    • build - directory that uses esbuild to create a standalone build file that can be used in browsers etc
  • tsconfigs - typescript config files that can be loaded through NPM
    • @paulmillr/jsbt/tsconfigs/esm.json - ESM base config
    • @paulmillr/jsbt/tsconfigs/cjs.json - common.js base config
    • @paulmillr/jsbt/tsconfigs/esm-less-strict.json - ESM config that sets noUncheckedIndexedAccess to false instead of true
  • jsbt.js - binary, provides helpers for build directory, such as reading package.json and transforming its package name into snake-cased or camelCased name. When installed through NPM, it can be used as npx jsbt. For example, for package "@namespace/ab-cd", it would emit:
    • npx jsbt outfile - namespace-ab-cd
    • npx jsbt global - namespaceAbCd

Updates

  • When prettier, tsconfig, esbuild are updated, adjust repo-template/package.json and repo-template/build/package.json
  • When node.js LTS is updated, adjust repo-template/.github/workflows/*.yml
  • When GitHub CI checkout action is updated, adjust repo-template/.github/workflows/*.yml
    • contents with actions/checkout@ will need to be set to new values
    • ensure it's commit ids and not tags, because tags are mutable (less secure)

License

MIT License