$30 off During Our Annual Pro Sale. View Details »

npm v7 Highlights

Ruy Adorno
October 27, 2020

npm v7 Highlights

Slides from the talk presented at the GitHub Presente! Online Meetup in Oct 27 2020: https://www.meetup.com/GitHub-Presente/events/273595143/

Ruy Adorno

October 27, 2020

More Decks by Ruy Adorno

Other Decks in Programming


  1. V7 Highlights
    27 Oct 2020 • GitHub Presente Meetup @ruyadorno

    View Slide

  2. Ruy Adorno
    Software Dev

    npm cli @GitHub

    View Slide

  3. • Make sure to get it

    • Out with Node.js 15

    • Bugs / Feedback? Reach out:


    View Slide

  4. • This presentation takes you through a quick
    and simple demo of a project using npm7

    • Let’s go

    View Slide

  5. • npm exec is a new command that brings
    npx to the core cli

    View Slide

  6. • npm exec is a new command that brings
    npx to the core cli

    • In this example we are going to run an
    Yeoman Generator by installing both the yo
    runner and generator-node packages and
    running as a single command

    View Slide

  7. View Slide

  8. View Slide

  9. View Slide

  10. View Slide

  11. • npm ls now will only show top-level
    packages by default

    • In order to get the same output as npm6 you
    can now use the “all” option: npm ls --all

    View Slide

  12. View Slide

  13. • npm audit got a much more clean and
    straightforward output, it no longer uses
    tables to display vulnerabilities and vuln
    count is no longer multiplying every single
    node in the tree

    View Slide

  14. • Let’s install a version of mkdirp that has a
    known CVE open in the npm security db

    View Slide

  15. • npm install output still let us know about the
    vulnerabilities at the end of an install

    View Slide

  16. View Slide

  17. View Slide

  18. • npm audit fix --force will
    solve the vulnerability by
    updating to semver-major
    versions which might in
    turn contain potential
    breaking changes

    View Slide

  19. • peerDependencies are now installed by
    default! Let’s run through a quick example by
    installing a dep that has a peer dep to react
    and see how it gets installed at the end

    View Slide

  20. View Slide

  21. View Slide

  22. View Slide

  23. View Slide

  24. • workspaces time!

    View Slide

  25. • workspaces time!

    • In this example we’re going to create a sub
    package (or a workspace) that we’re later on
    going to define as a workspace in our
    package.json, get it properly linked on our
    npm install and then require it from our app

    View Slide

  26. View Slide

  27. View Slide

  28. View Slide

  29. View Slide

  30. • ☝ Workspace created, let’s now add it to
    the workspaces property of the top-level
    package.json file

    View Slide

  31. View Slide

  32. • All set up! Let’s check everything

    View Slide

  33. View Slide

  34. View Slide

  35. • One of the very nice things about the UX
    around workspaces is the possibility to require
    that workspace with the same syntax you
    would use to require a package downloaded
    from the registry

    View Slide

  36. View Slide

  37. • This initial workspaces support will help
    unlock many workflows to npm users and
    there’s much more coming to v7.x with new
    commands to help working with workspaces.

    View Slide

  38. @ruyadorno

    and remember to:

    npm install -g npm@7

    View Slide