DEV Community

Cover image for Organizing a Large Number of Scripts in Package.json
bright inventions
bright inventions

Posted on • Originally published at brightinventions.pl

Organizing a Large Number of Scripts in Package.json

When it comes to managing a large number of scripts in your project's package.json file, it can quickly become challenging to navigate. However, there are simple steps you can take to make your scripts more organized and easier to read. In this short tutorial, we'll explore how adding separators can improve the readability of your package.json.

Using separators in your scripts object helps create clear sections and group related scripts together. Let’s do it in a few simple steps:


“Scripts” object with no separators:

"scripts": {
    "help": "scripts-help -w 40",
    "tsc": "tsc",
    "tscwatch": "tsc --watch",
    "serve": "serve ./site/"
  },
Enter fullscreen mode Exit fullscreen mode

Prints the available commands with npm run as:

Scripts available in dev-tips@1.0.0 via npm run-script:

  help
    scripts-help -w 40
  tsc
    tsc
  tscwatch
    tsc --watch
  serve
    serve ./site/
Enter fullscreen mode Exit fullscreen mode

But when separators are used like so:

"scripts": {
    "help": "scripts-help -w 40",
    "\n========== Building ==========": "",
    "tsc": "tsc",
    "tscwatch": "tsc --watch",
    "\n========== Serving ==========": "",
    "serve": "serve ./site/"
  },
Enter fullscreen mode Exit fullscreen mode

The available commands are printed in a much more readable form:


Scripts available in dev-tips@1.0.0 via npm run-script:

  help
    scripts-help -w 40

========== Building ==========

  tsc
    tsc
  tscwatch
    tsc --watch

========== Serving ==========

  serve
    serve ./site/

Enter fullscreen mode Exit fullscreen mode

Check out Github repository.



By Radosław Landowski, Backend Developer @ Bright Inventions

Top comments (0)