Registry / web-framework / esbuild-react18-useclient

esbuild-react18-useclient

library1.0.8jsnpmunverified

esbuild plugin for compiling React libraries compatible with React 18 server and client components, used with Next.js, Remix, etc. Current stable version 1.0.8. Deprecated in favor of esbuild-plugin-react18. Automatically adds 'use client' directive to client components during esbuild bundling. Key differentiator: enables libraries to ship both server and client components using esbuild/tsup without manual directive insertion. Lightweight alternative to full-fledged RSC tooling.

web-framework llm-agents

npm install esbuild-react18-useclient

github ↗package ↗

INSTALL

IMPORT

SIG · ESBUILD-REACT18-US

esbuild-react18-useclient

web-frameworkjavascriptv1.0.8

harness data pending

Install & Compatibility

Where this runs

No compatibility data collected yet for this library.

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

reactUseClient

✓ import reactUseClient from 'esbuild-react18-useclient'

✗ const reactUseClient = require('esbuild-react18-useclient')

Default export (ESM-only, no CJS support). Plugin function expects no arguments.

reactUseClient (CommonJS)

✓ const reactUseClient = require('esbuild-react18-useclient').default

✗ const reactUseClient = require('esbuild-react18-useclient')

CommonJS users must access .default because package is ESM-first.

Named export fallback (nonexistent)

✓ import reactUseClient from 'esbuild-react18-useclient'

✗ import { reactUseClient } from 'esbuild-react18-useclient'

Only default export is provided; named import does not exist.

Shows how to use the plugin with tsup and directly with esbuild. The plugin automatically adds 'use client' directives to client components.

// tsup.config.ts import { defineConfig } from 'tsup'; import reactUseClient from 'esbuild-react18-useclient'; export default defineConfig(options => ({ ...options, esbuildPlugins: [reactUseClient()], })); // or with esbuild directly: import * as esbuild from 'esbuild'; import reactUseClient from 'esbuild-react18-useclient'; await esbuild.build({ entryPoints: ['src/index.ts'], bundle: true, outfile: 'dist/index.js', plugins: [reactUseClient()], });

Debug

Known issues

deprecatedThis package is deprecated. Use esbuild-plugin-react18 instead.

fix

Replace with esbuild-plugin-react18: npm install esbuild-plugin-react18 and update import.

affects: >=1.0.0

gotchaPlugin must be called as a function (reactUseClient()) when passed to esbuildPlugins array; passing the function reference directly will cause errors.

fix

Ensure you call the plugin: [reactUseClient()] instead of [reactUseClient].

affects: >=1.0.0

gotchaOnly works with esbuild-based bundlers (tsup, esbuild). Does not work with webpack, rollup, or vite without esbuild plugin integration.

fix

Use compatible bundler. For webpack/rollup, consider alternatives like @rollup/plugin-babel with directives.

affects: >=1.0.0

Errors

Common errors & fixes

Error: Cannot find module 'esbuild-react18-useclient'

Package not installed or listed in dependencies.

fix

Run npm install --save-dev esbuild-react18-useclient

TypeError: reactUseClient is not a function

Import returns undefined due to wrong import style (CommonJS).

fix

Use import reactUseClient from 'esbuild-react18-useclient' (ESM) or const reactUseClient = require('esbuild-react18-useclient').default (CommonJS).

Error: [plugin] esbuild-react18-useclient: No 'use client' directive found in source

Plugin expects a 'use client' string in the source code to inject directive; missing in source files.

fix

Add 'use client'; at the top of your client component files.

Upgrade

Version history

1.0.8latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

18 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/mayank1513/esbuild-react18-useclient ↗

packagehttps://www.npmjs.com/package/esbuild-react18-useclient ↗