Creating an esbuild Plugin to Efficiently Copy Static Files
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: Demo Video
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
- https://github.com/nickjj/esbuild-copy-static-files
- https://github.com/nickjj/docker-flask-example
- https://github.com/nickjj/docker-django-example
- https://github.com/nickjj/docker-phoenix-example
- https://github.com/nickjj/docker-rails-example
- https://github.com/nickjj/docker-node-example
- https://github.com/nickjj/docker-play-example
Are you going to use this plugin? Let me know below.