Join egghead, unlock knowledge.

Want more egghead?

This lesson is for members. Join us? Get access to all 3,000+ tutorials + a community with expert developers around the world.

Unlock This Lesson
Become a member
to unlock all features

Level Up!

Access all courses & lessons on egghead today and lock-in your price for life.


    List available npm scripts and support tab completion

    Elijah ManorElijah Manor

    In this lesson we will look at different ways you can list the available npm scripts. Whether we want to pipe npm run through less or install an npm package such as completion or ntl, we have many options to quickly execute scripts with shell tab completion.



    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson




    As your set of npm scripts gets large, it could be easy to forget what scripts you have available. Thankfully, there are several ways to remind us of what's available. One is just running npm run from the command line. It will list out all your available scripts.

    However, if you have a lot of scripts, the output could be quite daunting. If you run it again and pipe it through last, then you could easily go through the output at your leisure. Another way is to provide tab-completion support by npm. An easy way to set this up is to type npm completion and to append it to either your bashrc or your zshrc file.

    Now, if we source our rc file, and then we run npm run space tab, it will list out all your scripts and you could tab through the different options. In this case, we'll pick build colon html and press the Enter key.

    You could also try this by starting with something that you know exist like the build script, and then press Tab. Then, it will show you only the options that match that criteria, so we could tab through and hit build colon html.

    If you've already run the script recently, you could partially type it out and then press the up arrow to iterate through your history. In this case, we're going to build our CSS file. Another technique is to install a node package called ntl, and we'll install it globally, which stands for npm task list.

    Once installed, you could just type ntl in your command line, press Enter, and it will prompt you for a list of tasks that you want to run. In this case, we'll go down and hit build html. Having an interactive prompt like this can be handy if you're new to repo, or if you only run scripts in it infrequently.