Get your next remote job on LaraJobs.
1 contributor Edit on GitHub JavaScript

Bun vs. NPM, Yarn, pnpm, and others

Table of contents:

Bun vs. NPM, Yarn, pnpm, and others

What is Bun?

Bun is a fast JavaScript all-in-one toolkit. It can be used as a runtime (a drop-in replacement much faster than Node.js), as a test runner, and even as a package manager. Which is what interests us today.

Unlike Node.js or Deno, Bun is built on top of Webkit‘s JavaScript engine (JavaScriptCore). Webkit is the basis for Mobile Safari on Apple’s mobile platforms, as well as Safari for Mac.

Why would you switch away from NPM, pnpm, or Yarn?

Why would you take some time to switch to Bun instead of sticking with a regular Node.js runtime?

Well, if you actually test Bun, you will notice how incredibly faster than Node.js it is. Up to 30x!

  1. Your front-end dependencies will install faster.
  2. Your assets will compile faster.
  3. Your continuous integration environment will also run faster since installing and compiling front-end dependencies takes less time.

How to install Bun on macOS using Homebrew

Installing Bun on macOS couldn’t be easier. Just add the new source using brew tap oven-sh/bun and install Bun by running brew install bun.

How to install on Linux and WSL

Installing Bun on Linux is as easy as on macOS. Run curl -fsSL https://bun.sh/install | bash. That’s it!

Linux users are recommended to make sure the unzip package is installed first. You should also be running the kernel in at least version 5.1, even if version 5.6 or higher is a better choice.

How to install Bun on Windows

For now, unfortunately, Bun’s package manager abilities are not available for Windows. But this shouldn’t be a problem if you are running WSL.

There’s currently an experimental version for it, but it’s not recommended to use it in production.

Make some room to replace NPM, Yarn, or pnpm with Bun

You don’t need a specific package manager. You can use whichever one you want. Which is great news for Bun!

If you were using NPM or pnpm, remove their lock files because you won’t need them anymore since Bun uses its own lock file called bun.lockb by default.

If you were using NPM:

rm package-lock.json

If you were using pnpm:

rm pnpm-lock.yaml

And if you were using Yarn:

rm yarn.lock

Install your front-end dependencies using Bun’s package management abilities

To install your dependencies using Bun, use bun install. So, how fast was it? I bet you didn’t expect that!

Oh and by the way, in case of a problem, if you want to disable the cache, use bun install --no-cache.

For additional information and options, please refer to the official documentation of the bun install command.

bun install in action.

Add a package using Bun

Adding a package using Bun can easily be done using the bun add command. You will certainly appreciate how incredibly fast it is as well.

Here’s an example with 3 packages:

bun add tailwindcss autoprefixer postcss

For additional information and options, please refer to the official documentation of the bun add command.

bun add in action.

Remove a package using Bun

Removing a package using Bun can easily be done using the bun remove command. You will certainly appreciate how incredibly fast it is as well.

Let’s use Axios as an example, since we can now use the native Fetch API:

bun remove axios

For additional information and options, please refer to the official documentation of the bun remove command.

Run your scripts using Bun

Bun should be able to be integrated into your existing workflow without any issues. Run the scripts defined in your package.json file just like before using bun run.

We can run our compilation process. For instance, I always use Vite:

bun run dev

For additional information and options, please refer to the official documentation of the bun run command.

Bun’s video presentation

Benjamin Crozat

Written by Benjamin Crozat

Indie hacker, blogger, and AI enthusiast building things with the TALL stack. 🔥

Follow me on:

Recommended articles

Use Bun as your package manager in any Laravel project Use Bun as your package manager in any Laravel project

Enjoy a faster workflow to build your front-end dependencies in your Laravel projects, thanks to the package management abilities of Bun.

Published on Sep 10, 2023

Use Bun as your package manager in any PHP project Use Bun as your package manager in any PHP project

Enjoy a faster workflow to build your front-end dependencies in your PHP projects, thanks to the package management abilities of Bun.

Published on Sep 10, 2023

Add Tailwind CSS to any Laravel project Add Tailwind CSS to any Laravel project

See how easy it is to add Tailwind CSS to any Laravel project and start building an amazing user interface.

Published on Oct 5, 2023

Add Alpine.js to any Laravel project Add Alpine.js to any Laravel project

Alpine.js is a great companion for a Laravel app. Let's see how you can add it in any project.

Published on Oct 13, 2023

Gold sponsors New

  • Wire Elements
    Beautiful handcrafted Livewire components.
    Check site
Your business here

Partners

If you buy from one of my partners below, I will be compensated at no cost to you. These are services I use or used, and 100% stand behind.

  • Scalable and reliable VPS hosting.
    Bonus: $200 of free credits
    Check site
  • The Google Analytics alternative without compromise.
    Free trial: 30 days
    Bonus: $10 off your first invoice
    Check site
  • Flare
    Track PHP and JavaScript errors in one place.
    Free trial: 10 days
    Check site
  • Keep track of your Google rankings.
    Free trial: 7 days
    Promo code: WELCOME30
    Check site
- / -