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

@milesj/build-tools

v3.0.0-alpha.1

Published

Shared build tools for easier development.

Downloads

19

Readme

👨‍💻 MilesOSS Dev Tools

I got tired of duplicating dev tool configuration files over and over again between projects, so I built Beemo and subsequently this repository to house them. The following tools are pre-configured:

  • Babel
    • Configured with env, react, and typescript presets.
    • Builds both CommonJS (cjs) and ECMAScript modules (esm).
    • Builds using the Babel runtime.
    • Cleans the target folder automatically.
    • Supports a Node.js specific configuration.
  • ESLint
    • Configured with import, jest, react, jsx-a11y, typescript, promise, and unicorn plugins.
    • Extends the airbnb configuration preset.
    • Provides a default .eslintignore.
  • Jest
    • Provides built-in code coverage thresholds.
  • Prettier
    • Configured to closely align with the Airbnb style guide.
    • Provides a default .prettierignore.
  • TypeScript
    • Configured to build ESM compatible files.
    • Strict typing enabled.
  • Templates that can be scaffolded into each project.
  • Full TypeScript support out of the box.
  • Integrated workspaces (monorepo) support.
  • And much more!

Install

yarn add @milesj/build-tools --dev

To compile Babel with its runtime, add the dependency per package.

yarn add @babel/runtime

Finally, add the following Beemo configuration to the root package.json.

{
  "beemo": {
    "module": "@milesj/build-tools",
    "drivers": ["babel", "eslint", "jest", "prettier", "typescript"]
  }
}

Init Project

To make use of the tools and to define default settings, we need to configure our package.json. To do this, run the following command in the project root.

yarn beemo run-script init

The following options are available:

  • --local (bool) - Project should use local configuration files.
  • --node (bool) - Project targets Node.js and not the browser.
  • --react (bool) - Project uses React.
  • --workspaces (bool) - Project is a monorepo and uses Yarn workspaces.

Sync Dotfiles

Some tools require dotfiles to be local to the project, which sucks. To get around this, we can easily scaffold them to each project, by running the following command in the project root.

yarn beemo scaffold project dotfiles

Lerna Support

Some projects require Lerna to manage multiple packages within the same repository -- a monorepo. Lerna isn't available out of the box as the dependency is quite large, most projects don't need it, and it's just too complicated to get working correctly.

So to support Lerna, please follow these instructions per project.

yarn add lerna --dev

Run the init script with the workspaces flag.

yarn beemo run-script init --workspaces

And remaining setup, like converting old Yarn scripts, or moving files to package folders. That should be it.