Registry / web-framework / esbuild-solid

esbuild-solid

library0.0.1jsnpmunverified

esbuild-solid is an ESBuild plugin (version 0.6.0, last updated May 2024) that compiles Solid JSX components using Babel under the hood. It automatically detects JSX syntax in .jsx/.tsx files, transforms them with babel-preset-solid, and integrates seamlessly into esbuild's build process. Key differentiators: zero configuration, lightweight (30 lines of code), and works with both JavaScript and TypeScript. Requires esbuild ^0.8.2 and solid-js ^0.23.

web-framework

npm install esbuild-solid

github ↗package ↗

INSTALL

IMPORT

SIG · ESBUILD-SOLID

esbuild-solid

web-frameworkjavascriptv0.0.1

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.

solidPlugin

✓ import { solidPlugin } from 'esbuild-solid'

✗ const solidPlugin = require('esbuild-solid')

Main export function that returns the esbuild plugin. Available as a named export. CJS users can use `const { solidPlugin } = require('esbuild-solid')` correctly, but `require('esbuild-solid')` returns an object, not a function.

default

✓ import solidPlugin from 'esbuild-solid'

✗ const solidPlugin = require('esbuild-solid')

Package also exports a default export (the same function). In ESM, default import is valid. In CJS, require returns the module object, so you must destructure.

Type definitions

✓ import type { SolidPluginOptions } from 'esbuild-solid'

✗ import { SolidPluginOptions } from 'esbuild-solid' (if used as value)

TypeScript types are bundled. Options type is exported for configuration, but currently there are no options (empty interface).

Basic usage of esbuild-solid plugin to build a Solid JSX app with esbuild, including error handling.

const { build } = require('esbuild'); const { solidPlugin } = require('esbuild-solid'); build({ entryPoints: ['app.jsx'], bundle: true, outfile: 'out.js', plugins: [solidPlugin()], }).catch(() => process.exit(1));

Debug

Known issues

gotchaPlugin only transforms files with JSX syntax detected via regex; files without JSX are passed through untransformed, which can lead to missing compilation if JSX is introduced dynamically.

fix

Ensure all files containing JSX use .jsx or .tsx extensions; the regex checks for JSX syntax but is heuristic-based.

affects: *

deprecatedPeer dependencies require solid-js ^0.23, which is outdated; newer versions of Solid (>=1.0) may break.

fix

Consider using a more recent fork or upgrading to a maintained Solid plugin that supports Solid v1+.

affects: <=0.6.0

breakingVersion 0.6.0 switched build system to unbuild; previously the package was built differently, potentially breaking direct imports of internal files.

fix

Import only from 'esbuild-solid' main entry; do not rely on subpath imports.

affects: >=0.6.0

gotchaThe plugin uses @babel/core and babel-preset-solid under the hood, which may conflict with existing Babel configuration if present.

fix

If you have a custom Babel setup, consider using a different plugin that allows configuration or ensure there is no conflict.

affects: *

Errors

Common errors & fixes

Cannot find module '@babel/core'

The plugin requires @babel/core as a dependency but it is not installed automatically.

fix

Install @babel/core and @babel/preset-typescript as devDependencies: npm install -D @babel/core @babel/preset-typescript

Error: The module "/path/to/node_modules/esbuild-solid/lib/index.js" does not provide a named export 'solidPlugin'

Using an older version of the package (pre-0.6.0) that did not have named exports or had different export structure.

fix

Update to latest version (>=0.6.0) or use default import: import solidPlugin from 'esbuild-solid'

error: No loader is configured for ".jsx" files: app.jsx

Forgetting to include the plugin in esbuild plugins array.

fix

Add the solidPlugin() call to the plugins array: plugins: [solidPlugin()]

Upgrade

Version history

0.0.1latest on npm

Audit

Dependencies

esbuildrequiredPeer dependency; provides the build tool that this plugin integrates with.

solid-jsrequiredPeer dependency; the Solid framework runtime required for compiled JSX.

Agent activity

2 hits · last 30 days

node

Resources

githubhttps://github.com/amoutonbrady/esbuild-solid ↗

packagehttps://www.npmjs.com/package/esbuild-solid ↗