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

@mrdiggles2/mux

v1.0.4

Published

muxer in typescript

Downloads

734

Readme

mux

Process muxer written in TypeScript.

Allows configuration of installation, runtime, and clean up of individual processes. Built in menu allows tailing, restarting, and rebuilding of processes within a single terminal session.

Particularly useful for monorepo setups where you have to run frontend, backend, and infrastructure locally.

usage

Getting started

  1. Install package
npm install @mrdiggles2/mux
  1. Create a mux.config.ts at the root level of your project. Sample:
import { MuxConfig } from '@mrdiggles2/mux/config';

const config: MuxConfig = {
  rootDir: __dirname,
  logPath: '.mux/logs',
  processes: [
    {
      name: 'long sleeper',
      run: {
        exec: 'sleep 1000',
      }
    }
  ]
};

export default config;
  1. Execute mux
npx mux

Configuration

Each process in mux.config.ts can be configured:

...
{
  name: 'YOUR PROCESS NAME HERE',
  run: MuxCommand,
  install?: MuxCommand,
  cleanup?: MuxCommand,

}

Where MuxCommand takes the form:

{
    exec: <Command to run in a separate process>;
    dir?: <Path to run `exec` from. Appended to provided `rootDir` in mux.config.ts>
    env?: {
      <Additional environment variables to run command with>
    }
}

Since mux.config.ts is a TypeScript file, you can also add dynamic configuration. Here is a more complete sample:

import path from "path";
import { MuxConfig } from '@mrdiggles2/mux/config';

const dockerComposeFiles = [
  'docker-compose.yml',
  'docker-compose.local.yaml'
].map(file => path.join(__dirname, file));

const dcBin = `docker compose --ansi=always ` + dockerComposeFiles.map(file => `-f ${file}`).join(' ');

const config: MuxConfig = {
  rootDir: __dirname,
  logPath: '.mux',
  processes: [
    {
      name: 'docker-services',
      install: {
        exec: `${dcBin} up --build -d --remove-orphans --wait`
      },
      run: {
        // Run `up` here again to smoothly support restarts. Effectively a no-op
        // if the containers are already running
        exec: `${dcBin} up -d --remove-orphans --wait && ${dcBin} logs -f`
      },
      stop: {
        exec: `${dcBin} down`
      }
    },
    {
      name: 'nest-backend',
      install: {
        exec: 'npm ci',
        dir: 'backend',
      },
      run: {
        exec: 'npx nest --watch',
        dir: 'backend',
        env: {
          NODE_ENV: development
          ...<ENV VARS>
        },
      }
    },
    {
      name: 'react-frontend',
      install: {
        exec: `npm ci`,
        dir: 'frontend',
      },
      run: {
        exec: `npx react-scripts start`,
        dir: 'frontend',
        env: {
          FORCE_COLOR: '1'
          ...<ENV VARS>
        }
      }
    },
  ]
};

export default config;