Learn Docker With My Newest Course

Dive into Docker takes you from "What is Docker?" to confidently applying Docker to your own projects. It's packed with best practices and examples. Start Learning Docker →

Creating an esbuild Plugin to Efficiently Copy Static Files

creating-an-esbuild-plugin-to-efficiently-copy-static-files.jpg

We'll compare the MD5 hash of the source and dest files and only copy files that changed. The plugin is available on NPM's registry.

Quick Jump:

I recently created an esbuild plugin called esbuild-copy-static-files. You can yarn or npm install it and it’s listed here https://www.npmjs.com/package/esbuild-copy-static-files.

In this video we’ll go over both using it and how it works.

# Demo Video

Timestamps

  • 0:24 – How I prefer to organize my assets
  • 2:13 – What this plugin does and how it efficiently copies files
  • 3:16 – A quick look at a basic esbuild config
  • 5:04 – Configuring the plugin with a custom destination directory
  • 6:29 – Demonstrating live reload with Phoenix
  • 7:23 – Configuration options for this plugin
  • 9:46 – How MD5 hashes are calculated
  • 10:25 – Skimming the README file, how to install it, etc.
  • 12:05 – High level overview of creating an esbuild plugin
  • 14:12 – Copying new files while esbuild’s watcher is running

References Links

Are you going to use this plugin? Let me know below.

Never Miss a Tip, Trick or Tutorial

Like you, I'm super protective of my inbox, so don't worry about getting spammed. You can expect a few emails per year (at most), and you can 1-click unsubscribe at any time. See what else you'll get too.



Comments