{"id":25440,"library":"esbuild-reloader","title":"esbuild-reloader","description":"An esbuild plugin that automatically reloads the browser page whenever a new build completes in watch mode. Version 0.4.1 is the latest stable release. It works by injecting a WebSocket listener into the bundle and triggering a page reload on rebuild. Unlike general-purpose live reloaders, this plugin is tightly integrated with esbuild's watch mode and does nothing during regular builds. It supports configurable host, port, reconnect timeout, and retry settings. Released on an as-needed cadence with no recent updates.","status":"active","version":"0.4.1","language":"javascript","source_language":"en","source_url":"https://github.com/YurySolovyov/esbuild-reloader","tags":["javascript","esbuild","reload","reloading","plugin"],"install":[{"cmd":"npm install esbuild-reloader","lang":"bash","label":"npm"},{"cmd":"yarn add esbuild-reloader","lang":"bash","label":"yarn"},{"cmd":"pnpm add esbuild-reloader","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"peer dependency; the plugin hooks into esbuild's watch mode","package":"esbuild","optional":false}],"imports":[{"note":"Package exports a default function only. Named import fails.","wrong":"import { reloader } from 'esbuild-reloader'","symbol":"default","correct":"import reloader from 'esbuild-reloader'"},{"note":"In CJS, assign the default export directly, not through destructuring.","wrong":"const { reloader } = require('esbuild-reloader')","symbol":"default","correct":"const reloader = require('esbuild-reloader')"},{"note":"TypeScript users can import the options interface by name. This is the only named export.","symbol":"EsbuildReloaderOptions","correct":"import type { EsbuildReloaderOptions } from 'esbuild-reloader'"}],"quickstart":{"code":"import esbuild from 'esbuild';\nimport reloader from 'esbuild-reloader';\n\nawait esbuild.build({\n  entryPoints: ['src/index.js'],\n  outfile: 'dist/bundle.js',\n  bundle: true,\n  watch: true,\n  plugins: [\n    reloader({\n      host: '127.0.0.1',\n      port: 8001,\n      reconnectTimeout: 5000,\n      retries: 10\n    })\n  ]\n});","lang":"typescript","description":"Sets up esbuild watch mode with esbuild-reloader plugin to auto-reload on rebuild."},"warnings":[{"fix":"Ensure the esbuild build config has `watch: true`.","message":"Plugin only works when watch mode is enabled; does nothing in regular builds.","severity":"gotcha","affected_versions":">=0.1"},{"fix":"Adjust CSP to allow 'ws://' connections to the specified host/port.","message":"Injecting the WebSocket listener may cause browser CSP issues if Content-Security-Policy blocks inline scripts or websocket connections.","severity":"gotcha","affected_versions":">=0.1"},{"fix":"Prefer esbuild's built-in serve mode or use a more actively maintained reload plugin.","message":"The package lacks explicit support for esbuild v0.18+ where watch API changed. May still work but not officially tested.","severity":"deprecated","affected_versions":">=0.18"}],"env_vars":null,"last_verified":"2026-05-01T00:00:00.000Z","next_check":"2026-07-30T00:00:00.000Z","problems":[{"fix":"Add `watch: true` to your esbuild build options.","cause":"esbuild.build() called without `watch: true`.","error":"Error: [plugin: esbuild-reloader] Must be used with watch mode"},{"fix":"Use `import reloader from 'esbuild-reloader'` or `const reloader = require('esbuild-reloader')`.","cause":"Using incorrect import style (named import instead of default).","error":"TypeError: esbuild_reloader_1.default is not a function"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}